angularjs - 动态加载 ui-router 状态

Question

成功登录我的应用程序后，我想动态加载用户可用的所有状态api/js。动态加载的状态将始终包含一个抽象状态app.module，它是唯一已知的状态，并且是同一下载中所有其他状态的根。

我的第一种方法是在登录后使用 oc.lazyLoad。它工作正常，但刷新浏览器时不行。然后我尝试在 module.run 中使用 oc.lazyLoad 加载，但它不起作用。

我一直在尝试将 oc.lazyLoad 与来自 ui-router extras 的 futureState 一起使用，但我无法让它工作。

我需要一些关于如何配置$futureStateProvider的帮助，如果它甚至可以做我想做的事。

Answer 1

不需要延迟加载。

用于添加动态状态。我只需要在配置阶段为我的应用程序添加状态提供程序引用。

angular.module('app.module').config(function ($stateProvider, $urlRouterProvider) {
        angular.module('app.module').$stateProvider = $stateProvider;        
        //send to login first
        $urlRouterProvider.otherwise("/user/login");      
});

然后在用户登录成功后的登录服务中，向状态提供者添加一些新闻状态。

loginSuccess(){
   $http.get('api/states/').then(function(states){
     bindStates(states);
   });
}

function bindStates(states) {
    states.forEach(function bind(stateData) {
        // add new states
        angular.module('app.module').$stateProvider.state({
            name: stateData.name,
            url: stateData.url,
            template: stateData.template,
            params: {
                'pageId': null
            },
            abstract: stateData.abstract
        });
    });

    // go to default state
    $state.go('main');
}