如何为非抽象状态创建默认嵌套状态

时间:2015-01-12 09:52:43

标签: javascript angularjs angular-ui-router

我使用ui-router如下:

3个主要州homeprofilesettings是这样的: enter image description here

第二个州profile有2个嵌套状态profile.aboutprofile.main enter image description here

我需要索引页面上可点击的配置文件状态加载配置文件视图并重定向到默认嵌套状态profile.about此处

enter image description here

这是plunker与我到目前为止所得到的。

我知道这个解决方案:

其他人都需要一个抽象的父母,这个父母是不可忽视的,因此是抽象的。

那么,总结我的问题是如何为非抽象状态创建嵌套的默认视图?

1 个答案:

答案 0 :(得分:1)

正如评论中所讨论的,这里的解决方案通常是.when()定义,如下所示:

在2.0.13之前的版本中,我们可以使用像这样的原生解决方案(myService是一个默认值的地方......如果没有参数,则不需要)

var whenConfig = ['$urlRouterProvider', function($urlRouterProvider) {

    $urlRouterProvider
      .when('/app/list', ['$state', 'myService', function ($state, myService) {
            $state.go('app.list.detail', {id: myService.Params.id});
    }])
    .otherwise('/app');
}];
...
app.config(whenConfig) 

但是在2.0.13版本中修复后,这不起作用,但我们可以使用此解决方法:

var onChangeConfig = ['$rootScope', '$state',
 function ($rootScope, $state) {

  $rootScope.$on('$stateChangeStart', function (event, toState) {    
    if (toState.name === "app.list") { 
      event.preventDefault();
      $state.go('app.list.detail', {id: 2});
    }
  });

}]

有关其他一些示例,请参阅此错误报告:https://github.com/angular-ui/ui-router/issues/1584