我正在使用angular构建一个小型Web应用程序。我正在尝试设置基于角色的导航。好像在页面加载时未调用isAdmin函数,因为我只能看到foo锚标记。
的HTML
<body ng-controller='AccountController'>
<nav class="navbar navbar-default">
<ul>
<li><a href='google.com'>foo</a></li>
<li ng-if="isAdmin()"><a href='google.com'>bar</a></li>
</ul>
</nav>
</body>
AccountController
var app = angular.module('appControllers', []);
app.controller = angular.controller('AccountController', ['$scope',
function($scope, $http) {
$scope.isAdmin = function() {
return true; //Just as a test to make sure it works
}
}]);
理想情况下,这将命中一个将返回管理员状态的Web服务,但现在我想使其正常工作。
感谢您提前提供的所有帮助,
安德烈斯
最佳答案
在您的示例中,您需要删除括号才能使其正常工作。但是我通常使用自定义指令来使其工作。例:
<div class="somediv" show-for-role="ROLE_A,ROLE_B"></div>
而且,如果您的用户具有其中某些角色,则可以对其进行管理。
appModule.directive('manageAccess', ['someState', function (appState) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var user = someState.currentUser;
scope.$watch(someState.watchCurrentUser, function(n,o){
if (n === o){
return;
}
hideShow(element,attrs,n);
});
hideShow(element,attrs,user);
}
}
var hideShow = function(element,attrs,user){
element.hide();
if (user) {
var role = attrs.showForRole;
if (role){
role.split(',').forEach(function(it){
if (it == user.role){
element.show();
}
})
}
}};
关于javascript - AngularJS基于 Angular 色的导航,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/26224079/