是否可以在有条件的 ui 路由器中创建嵌套 View ? 条件分配给用户 Angular 色。
例如我有两种类型的用户:admin 和user。 如果用户正在打开设置页面,则 ui 路由器只会添加分配给他 Angular 色的 View 。
这是我的配置代码示例
var app = angular.module('myApp', ['ui.router']);
app.config(function ($stateProvider, $urlRouterProvider){
$stateProvider
.state('home', {
url: '/home',
templateUrl: '/home.html',
controller: 'homeController'
})
.state('settings', {
url: '/settings',
data: {
roles: ['admin', 'moderator', 'user']
},
views:{
'':{
templateUrl:'/settings.html',
},
'piView@settings':{
data: {
roles: ['user']
},
templateUrl:'/personalInformation.html'
},
'permissionsView@settings':{//load this view if user is administrator
//I need some condition for this
data: {
roles: ['admin']
},
templateUrl: '/permissionsView.html'
}
},
controller: 'settingsController'
});
$urlRouterProvider.otherwise( function($injector) {
var $state = $injector.get("$state");
$state.go('/home');
});
});
最佳答案
将为每个用户(管理员或匿名)注入(inject) View 。但是我们可以管理哪个 View 。最好的方法是使用 templateProvider
强>。
基于这个问答:
Confusing $locationChangeSuccess and $stateChangeStart
我使用了上面源代码中的 plunker and adjusted it a bit
那么,让我们有这两个目标(在 index.html 中)
<div ui-view="onlyForAdmin"></div>
<div ui-view=""></div>
还有一个状态 public,对于 Admin 来说甚至会显示 onlyForAdmin 的内容,设置如下:
.state('public', {
url: "/public",
data: { isPublic: true },
views: {
'@' : {
templateUrl: 'tpl.html',
data: { isPublic: true },
},
'onlyForAdmin@' : {
templateProvider: ['$templateRequest','userService',
function($templateRequest,userService)
{
if(userService.isAdmin())
{
return $templateRequest("justForAdmin.html");
}
return ""; // other than admin will see nothing
}
]
}
}
})
justForAdmin.html 的内容(例如 <h2>just for admin</h2>
)将仅注入(inject)一些授权服务将找到用户作为管理员...
查一下here
关于javascript - ui 路由器嵌套 View 条件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33260435/