是否可以替换/覆盖ui-router状态定义?(默认状态由另一个模块"定制")

plo*_*ng0 4 angularjs angular-ui-router

是否可以简单地用新的定义替换状态定义?

我的用例是一个模块定义了状态,我希望能够从不同的模块中替换该状态定义.基本上,初始定义是一个"默认"定义,我希望有可能从不同的模块定制状态.

我意识到在配置时执行此操作可能会导致模块首先定义它的竞争条件.我研究了在运行时进行此操作的可能性,但无法使其正常工作.

我可以通过创建全新的状态来完成我想要的任务,但我想使用原始状态中的相同URL.

编辑:

为了进一步澄清我想要完成的事情......请考虑以下代码:

angular.module('module1', ['ui.router'])
.config(['$stateProvider', function($stateProvider){
    $stateProvider
        .state('root', {
            url: '',
            abstract: true,
            template: '<div class="layout sub" ui-view="sub"></div>'
        })
        .state('root.sub1', {
            url: '/sub1',
            views: {
                'sub@root': {
                    template: '<p>Default sub state 1</p>'
                }
            }
        });
}]);

angular.module('module2', ['ui.router'])
.config(['$stateProvider', function($stateProvider){
    $stateProvider
        .state('root.sub1', {
            url: '/sub2',
            views: {
                'sub@root': {
                    template: '<p>Customized sub state 1</p>'
                }
            }
        });
}]);
Run Code Online (Sandbox Code Playgroud)

当然这给出了"错误:状态'root.sub1''已经定义了"

plo*_*ng0 6

好的,所以当我整理一个下一次尝试的plnkr演示时,我发现如果你使用$ state.get并更新它,它实际上是有效的.

angular.module('module2', ['ui.router'])
.run(['$state', function($state){
  var state = $state.get('root.sub1');
  if(state && state.views && state.views['sub@root']){
    state.views['sub@root'].template = '<p>Customized sub state 1</p>';
  }
}]);
Run Code Online (Sandbox Code Playgroud)

Plnkr:http://plnkr.co/edit/xLdCgjeM33z2Hf5CHfZR

编辑:

我发现它在我的应用程序中无效,因为我没有定义我想在原始状态下覆盖的视图.

示例(不起作用):

angular.module('module1', ['ui.router'])
.config(['$stateProvider', function($stateProvider){
    $stateProvider
        .state('root', {
            url: '',
            abstract: true,
            template: '<div class="layout sub" ui-view="sub"></div>'
        })
        .state('root.sub1', {
            url: '/sub1',
            views: {
            }
        });
}]);

angular.module('module2', ['ui.router'])
.run(['$state', function($state){
    var state = $state.get('root.sub1');
    if(state && state.views){
        state.views['sub@root'] = { template: '<p>Customized sub state 1</p>' };
    }
}]);
Run Code Online (Sandbox Code Playgroud)