angular ui-router - 嵌套控制器 - 如果子控制器处于相同状态，则启动两次父控制器

Question

.state('home', {
    url: '/home',
    views: {
        'main': {
            templateUrl: './main.html',
            controller: 'mainController'
        },
        'parent@home': {
            templateUrl: './parent.html',
            controller: 'parentController'
        },
        'child@home':{
            templateUrl: './child.html',
            controller: 'childController'
        },
        'otherPage@home': {
            templateUrl: './other-page.html',
            controller: 'otherController'
        }
    }
})

在parent.html中，我有子视图。基本上，父控制器（parentController）在此设置中启动两次。如果我删除了child @ home状态，则parentController只启动一次。我做错了什么，是否有更好的方法来定义这些状态？

的index.html

<div class="maincontent" ui-view="main"></div>

main.html中

<div class="maincontent container-fluid" ui-view="parent"></div>
<div class="maincontent container-fluid" ui-view="otherPage"></div>

parent.html

<div ui-view="child"></div>

Answer 1

重新定义这样的状态：

.state('home', {
    url: '/home',
    views: {
        '': {
            templateUrl: './main.html',
            controller: 'mainController'
        },
        'parent@home': {
            templateUrl: './parent.html',
            controller: 'parentController'
        },
        'child@home':{
            templateUrl: './child.html',
            controller: 'childController'
        },
        'otherPage@home': {
            templateUrl: './other-page.html',
            controller: 'otherController'
        }
    }
})

根据我的理解，带有空键的视图将被加载为home状态的默认值。

通过这种方式，您的main.html模板将包含指向其他ui-views的指针，因为您已完成parent和otherPage。

我无法对此进行测试，因为我不在我的开发电脑上，但我认为它应该可行，因为它是我的几个AngularJS项目中遵循的格式。