在加载状态之前,我需要在 angular js 中为每个状态添加角色?

Before loading state i need add role for each state in angular js?

在下面的示例中,我在 data 中有一个名为 roles 的变量,为此我必须添加角色数组。现在我在第二种状态下已经预定义了角色,但是这个角色数组我必须从网络上加载 api。

.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('signin');
$stateProvider.state('site', {
    'abstract': true,
    resolve: {
        authorize: ['authorization', function (authorization) {
            alert(JSON.stringify(authorization))
            return authorization.authorize();
        }, ]
    }
})
.state('signin', {
    parent: 'site',
    data: {
        roles: []
    },
    url: '/signin',
    views: {
        '': { templateUrl: '/signin.html' },
        'content@': {
            templateUrl: '/index.html',
            controller: 'SigninCtrl'
        }
    }
})

.state('WorkArea', {
   parent: 'site',
   url: '/WorkArea',
   data: {
       roles: ['User', 'Dev']
   },
   views: {
       '': { templateUrl: '/Views/WorkArea/WorkArea.html' },
       'ContentOne@': {
           templateUrl: '/Views/WorkArea/ProjectList.html',
           controller: 'ProjectController'
       }
   }
 })
}]);

我指的是下面的这个例子link:-

angular ui-router login authentication

这样定义:

 .state('WorkArea', {
   parent: 'site',
   url: '/WorkArea',
   data: {
       roles: (function() {
                return ['User', 'Dev'];
              })()
   },
 })

对于这种情况,您可以使用 IIFE 将属性动态添加到数据属性。

在你的 app.run 中使用:

$rootScope.$on('$stateChangeStart', function(event, toState){ 
    var roles = toState.data.roles ;
    console.log(roles);
   // your custom logic here for that state
})