我有一个基本的 Index.html 文件，其结构如下:
<body class="{{$state.current.name.replace('.','-')}}">
<div ui-view>
<div ng-include src="'partials/menu.html'"></div>
<!-- <div ng-menu class="ui top blue sidebar menu active"></div> -->
<div class="view-height-100"></div>
</div>
...
</body>
当我处于登录状态时，它运行得很好:
$stateProvider
.state('login', {
url: '/login',
templateUrl: 'partials/login-area.html',
controller: 'LoginController',
});
但是，当我路由到 user.management 状态时，没有显示任何内容(但 Chrome 正在加载模板，因此我可以访问范围并且 .html 文件就在那里):
$stateProvider
.state('user', {
url: '/:buildingName',
controller: 'CurrentBuildingController',
data: {
access: ['user']
}
})
.state('user.management', {
url: '/management',
templateUrl: '/views/management.html',
controller: 'ManagementController'
})
Can someone explain me why?
最佳答案
父状态简单地必须有其子级的目标(除非我们使用绝对命名来定位某个 super 父级，但这是另一种方法)
.state('user', {
url: '/:buildingName',
template: "<div ui-view></div>",
controller: 'CurrentBuildingController',
data: {
access: ['user']
}
})
看到我们现在有 template: "<div ui-view></div>", 它将作为任何子状态 'user.xxx' 的查看目标
还检查:
EXTEND - 让子进程以index.html为目标
我们可以使用绝对命名，然后child将被直接注入(inject)到index.html中。有a working plunker (有意父级不会加载，它没有任何模板)
.state('parent', {
url: "/parent",
//templateUrl: 'tpl.html',
})
.state('parent.child', {
url: "/child",
views: {
'@': {
templateUrl: 'tpl.html',
controller: 'ChildCtrl',
}
}
})
查看更多信息:
Angularjs ui-router not reaching child controller
关于angularjs - 不同状态不显示模板内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32890011/