Question

这样可行，但Json不是我想检索数据的方式：

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);
    });

这在检索数据时不起作用：

 app.config(['$locationProvider', '$resourceProvider', '$stateProvider', function ($locationProvider, $resourceProvider, $stateProvider) {
    $locationProvider.html5Mode(true);

  not working --->  var states = $resource('http://localhost:9669/api/breeze/states').query();

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

我的问题有两个方面：

如何在app.config中检索远程数据，以便填充$ StateProvider。
我知道即使实现这一点，我也会遇到
的返回值问题
＆＃34; [＆＃39; user＆＃39;，function（user）{user.isAuthenticated（）; }]＆＃34;

因为它将以字符串形式返回，而angular将不会将其识别为函数。我该如何克服这个问题？

[旁注：api调用确实有效，问题不在于api控制器。]

谢谢。

Answer 1

<强> [解决]

文件是关于这件事的零食，但在缝合各种帖子后，我找到了答案。

首先必须明白数据无法在$ stateProvider中填充，因为它是app.config的一部分，因为app.config只初始化提供者，实际的http服务必须在app.run中执行。

第1步：声明2个Globals，即。 $ stateProviderRef和$ urlRouterProviderRef在app.module之前引用并传递实际的$ stateProvider＆amp; $ urlRouterProvider在app.config中引用它们：

(function() {
   var id = 'app';

   var $stateProviderRef = null;
   var $urlRouterProviderRef = null;
   ......

   // Create the module and define its dependencies.
   app.config(function($stateProvider, $urlRouterProvider) {
           $stateProviderRef = $stateProvider;
           $urlRouterProviderRef = $urlRouterProvider;
       });
   .......

第2步：创建自定义工厂提供商：

app.factory('menuItems', function($http) {
    return {
        all: function() {
            return $http({
                url: 'http://localhost:XXXX/api/menuitems',
                method: 'GET'
            });
        }
    };
});

第3步：在app.run中调用自定义提供程序：

  app.run(['$q', '$rootScope', '$state','$urlRouter', 'menuItems',
     function($q, $rootScope, $state, $urlRouter, menuItems) {
        breeze.core.extendQ($rootScope, $q);
        menuItems.all().success(function (data) {                        
                angular.forEach(data, function (value, key) {
                    var stateName = 'state_' +  value.OrderNum; //<-- custom to me as I have over 300 menu items and did not want to create a stateName field
                    $stateProviderRef.state(stateName, {url:value.url, templateUrl:value.templateUrl, controller:value.controller });
                });
                   // because $stateProvider does not have a default otherwise
                   $urlRouterProviderRef.otherwise('/');
          });            
           .....
         }
      ]);

AngularJS - 在app.config中对$动态数据进行$ StateProvider查询

1 个答案: