在 html 中声明控制器与父状态相同答案

【问题标题】：Declaring controller in html same as parent state在 html 中声明控制器与父状态相同
【发布时间】：2016-02-11 04:40:09
【问题描述】：

我正在使用 ui-router 并且有带有视图的嵌套状态。我目前让我的控制器运行了两次，因为它在 app.js 文件和ng-controller 中声明。我需要在 html 文件中设置ng-controller，因为我的嵌套状态中有动态视图，每个视图都有不同的控制器。

这是我的 app.js 文件

.state('index.region', {
    url: 'region',
    templateUrl: 'views/region.html',
    controller: 'RegionCtrl'
})
.state('index.region.detail', {
    url: '/:regionId',
    params: {
        detail: 'overview'
    },
    views: {
        'detail@index' : {
            templateUrl: function($stateParams) {
                if($stateParams.detail === 'info' || $stateParams.regionId) {
                    return 'views/regionInfo.html';
                } else if ($stateParams.detail === 'overview') {
                    return 'views/regionOverview.html';
                }
            }
        }
    },
})

views/regionOverview.html的HTML

<div ng-controller="RegionCtrl">

views/regionInfo.html的HTML

<div ng-controller="RegionInfoCtrl">

【问题讨论】：

标签： javascript html angularjs angular-ui-router

【解决方案1】：

在这种情况下，您不应该从 html 加载控制器，而应该从状态本身加载控制器。

我建议您使用状态的controllerProvider 选项来动态加载控制器。

.state('index.region', {
    url: 'region',
    templateUrl: 'views/region.html',
    controller: 'RegionCtrl'
})
.state('index.region.detail', {
    url: '/:regionId',
    params: {
        detail: 'overview'
    },
    views: {
        'detail@index' : {
            templateUrl: function($stateParams) {
                if($stateParams.detail === 'info' || $stateParams.regionId) {
                    return 'views/regionInfo.html';
                } else if ($stateParams.detail === 'overview') {
                    return 'views/regionOverview.html';
                }
            },
            controllerProvider: function($stateParams){
                 if($stateParams.detail === 'info' || $stateParams.regionId) {
                    return 'RegionInfoCtrl';
                } else if ($stateParams.detail === 'overview') {
                    return ''; //return nothing
                }
            }
        }
    },
})

Demo Plunkr

【讨论】：

这正是我最初想要的。但是return " "; 不起作用
你可以试试this plunkr
我会接受这个答案，但它并没有完全解决我的问题，因为显然 [for children states] 没有其他东西被继承（没有控制器、模板、url 等） 来自 ui-router 文档
@tester123 我可以知道你的确切目标是什么吗？你结账了吗？
是的，我做到了，但我的目标是让我的一个子状态视图使用与父视图相同的控制器，因为其中的逻辑与子视图所需的逻辑相同。然后，如果请求其他视图，请使用它自己的控制器。