登录后使用ui路由器注册未来状态额外的未来状态模块

Question

我自己试图在登录后根据用户类型注册未来状态。

例如：如果user_type是buyer，那么我需要注册我从futureStates_buyer.json 维护的所有路由器

如果user_type是admin，那么我需要注册我从futureStates_admin.json 维护的所有路由器

实验1（根据样本）

示例URL:http://christopherthielen.github.io/ui-router-extras/example/future/

我可以在配置阶段设置以下配置。我知道提供者设置应该在配置阶段。

app.config(function($stateProvider, $urlRouterProvider, $futureStateProvider) {
 $futureStateProvider.stateFactory('ngload', ngloadStateFactory); 
 $futureStateProvider.addResolve(loadAndRegisterFutureStates);
});

工作演示：http://plnkr.co/edit/9dUm0f6g2V5PM4m7YlTD?p=preview

实验2（这就是我正在尝试的）

但是，在我的情况下，我不想在配置阶段为整个应用程序注册所有路由器。它将是非常高的配置。所以我尝试的是，一旦登录，我就可以在登录响应中获得用户类型，基于该用户类型，我需要注册未来的状态。

//config phase
app.config(function($stateProvider, $urlRouterProvider, $futureStateProvider) {
 //Planned to use futureStateProvider later in controller
  lazyLoad = {stateProvider: $stateProvider, futureStateProvider:$futureStateProvider};
});

//Login controller
app.controller('LoginController', ['$scope', '$rootScope', '$state', '$http', function($scope, $rootScope, $state, $http) {
     $scope.doLogin = function(){
            //After successfull login
            //Service invocation comes here
            console.log("Logged in!!");
            $rootScope.userInfo = {"loggedIn" : true };
            $state.go('dashboard');
            //Now I want to register future state based on login response i.e user_type
            // If user type is buyer, I want to registrer futureStates_buyer.jsom
            // If user type is vendor, I want to registrer futureStates_vendor.jsom
            lazyLoad.futureStateProvider.stateFactory('ngload', ngloadStateFactory); // register AngularAMD ngload state factory
            lazyLoad.futureStateProvider.addResolve(loadAndRegisterFutureStates);
        }
}]);

不工作：http://plnkr.co/edit/pCEKLopOqSKghermTHP8?p=preview

任何帮助都将不胜感激。提前感谢：）

Answer 1

我通过如下更改controller部分中的代码解决了这个问题，它运行良好。

   //Login controller
    app.controller('LoginController', ['$scope', '$rootScope', '$state', '$http', function($scope, $rootScope, $state, $http) {
        $scope.login = {"username":"admin", "password":"admin123"};
        $scope.doLogin = function(){
            //After successfull login
            //Service invocation comes here
            console.log("Logged in!!");
            $rootScope.userInfo = {"loggedIn" : true };

            //Now I want to register future state based on login response i.e user_type
            // If user type is buyer, I want to registrer futureStates_buyer.jsom
            // If user type is vendor, I want to registrer futureStates_vendor.jsom
            /*          
            var loadAndRegisterFutureStates = function ($http) {
              // $http.get().then() returns a promise
              return $http.get('futureStates_buyer.json').then(function (resp) {
                angular.forEach(resp.data, function (fstate) {
                  // Register each state returned from $http.get() with $futureStateProvider
                  lazyLoad.futureStateProvider.futureState(fstate);
                });
              });
            };
            */
            $http.get('futureStates_buyer.json').then(function (resp) {
                angular.forEach(resp.data, function (fstate) {
                  // Register each state returned from $http.get() with $futureStateProvider
                  lazyLoad.futureStateProvider.futureState(fstate);
              });
              $state.go('dashboard');
      });
            lazyLoad.futureStateProvider.stateFactory('ngload', ngloadStateFactory); // register AngularAMD ngload state factory
            //lazyLoad.futureStateProvider.addResolve(loadAndRegisterFutureStates);
        }
    }]);

工作演示：http://plnkr.co/edit/ZXty2SkmGbuwnpaJoh7C?p=preview