AngularJS-动态$StateProvider

Question

我急切地试图创建一个dianmic$StateProvider:

标准静态$StateProvider:

    $stateProvider
      .state('main',
      {
        url: '/',
        templateUrl: '/views/main.html',
        controller: 'MainCtrl'
      })
      .state('login',
      {
        templateUrl: '/views/login-form.html',
        controller: 'LoginCtrl'
      })
      .state('logout',
      {
        controller: 'LogoutCtrl'
      })
      .state('sales', {
        templateUrl: '/views/sales-data.html',
        controller: 'SalesDataCtrl',
        resolve: {
          user: 'User',
          authenticationRequired: function(user) {
            user.isAuthenticated();
          }
        }
      });

动态$StateProvider:

var verify = function(user) { user.isAuthenticated(); };

var states= [
{ name: 'main', url: '/', templateUrl: '/views/main.html', controller: 'MainCtrl' },
{ name: 'login', url: '', templateUrl: '/views/login-form.html', controller: 'LoginCtrl' },
{ name: 'logout', url: '', templateUrl: '', controller: 'LogoutCtrl' },
    {
        name: 'sales',
        url: '',
        templateUrl: '/views/sales-data.html',
        controller: 'SalesDataCtrl',
        //resolve:
        //[
        //    { user: 'User', authenticationRequired: 'verify();' }
        //]
    }
];
       // w/o the array brackets in resolve the navigation does not work.
       // with the array brackets, once sales is clicked I get:
       // Error: [ng:areq] Argument 'fn' is not a function, got Object

只要我不使用resolve，下面的两种方法就可以工作:

  This works:
   angular.forEach(states, function(state) {
        $stateProvider.state(state);
    });

   This works:
   angular.forEach(states, function(state) {
        $stateProvider.state(state.name, state);
    });

问题: 如何使这个动态Stat StateProvider与resolve一起工作？

Answer 1

解决方案：

var states = [
{ name: 'main', url: '/', templateUrl: '/views/main.html', controller: 'MainCtrl' },
{ name: 'login', url: '', templateUrl: '/views/login-form.html', controller: 'LoginCtrl' },
{ name: 'logout', url: '', templateUrl: '', controller: 'LogoutCtrl' },
    {
        name: 'sales',
        url: '',
        templateUrl: '/views/sales-data.html',
        controller: 'SalesDataCtrl',
        resolve: {
            user: 'User',
            authenticationRequired:
            ['user', function(user) { user.isAuthenticated(); }] // <-------------------------
        }
    }
];

    angular.forEach(states, function (state) {
        $stateProvider.state(state.name, state);
    });

.

Answer 2

我想你在打电话 $stateProvider.state(...) 不正确的是，它需要一个状态ID，然后是配置对象。

假设你的 name 属性是有效的和唯一的，你应该能够做到这一点（或根据需要调整它）:

angular.forEach(states, function(state) {
    $stateProvider.state(state.name, state);
});