在index.html中设置多个ui视图时不显示
在index.html中设置多个ui视图时不显示
提问于 2015-03-30 20:10:07
我正在尝试实现一些东西，如多名视图 wiki页面中的ui-router所示。该示例如下：
$stateProvider
.state('report', {
views: {
'filters': { ... templates and/or controllers ... },
'tabledata': {},
'graph': {},
}
})按照下面所示的当前设置，路由不起作用。不知道我在这里做错了什么？
我当前的index.html如下所示：
<body>
<div ui-view="anonymous"></div>
<div ui-view="home"></div>
</body>然后我的app.js：
app.constant("AccessLevels", {
anon: 0,
user: 1
});
app.config(["$stateProvider", "$urlRouterProvider", "AccessLevels", function ($stateProvider, $urlRouterProvider, AccessLevels) {
/* ANONYMOUS USERS */
$stateProvider
.state('anon', {
abstract: true,
template: '<ui-view/>',
data: {
access: AccessLevels.anon
}
})
.state('anon.login', {
url: '/login',
views: {
anonymous: {
templateUrl: 'Client/scripts/app/partials/account/login.html',
controller: 'loginCtrl'
}
}
})
.state('anon.register', {
views: {
anonymous: {
url: '/register',
templateUrl: 'Client/scripts/app/partials/account/registration.html',
controller: 'registerCtrl'
}
}
});
/* AUTHENTICATED USERS */
$stateProvider
.state('user', {
abstract: true,
template: '<ui-view/>',
data: {
access: AccessLevels.user
}
})
.state('user.home', {
views: {
'home': {
url: '/home',
templateUrl: 'Client/scripts/app/partials/home/dashboard/index.html',
controller: 'homeCtrl'
}
}
})
.state('user.deliveries', {
views: {
'home_content': {
url: '/home/deliveries',
templateUrl: 'Client/scripts/app/partials/home/deliveries/deliveries.html',
controller: 'deliveryCtrl'
}
}
});
$urlRouterProvider.otherwise('/login');
}]);回答 1
Stack Overflow用户
回答已采纳
发布于 2015-03-31 06:08:18
通常，如果我们针对父对象，我们可以使用简化的，也就是所谓的相对视图目标名。这不是你的案子，因为
.state('anon', {
abstract: true,
template: '<ui-view/>', // parent contains unnamed view
...
})
.state('anon.login', {
url: '/login',
views: {
anonymous: { // this view is not in parent所以我们必须使用绝对命名
.state('anon.login', {
url: '/login',
views: {
'anonymous@': { // no we target root
// realtive
'' : { // here we target unnamed parent view
// absolute
'@anon' : { //the same as the line above一个指向医生的链接：
在幕后，每个视图都分配一个遵循
viewname@statename方案的绝对名称，其中视图名称是视图指令中使用的名称，状态名称是状态的绝对名称，例如contact.item。您还可以选择用绝对语法编写视图名称。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29355369
复制相关文章
相似问题
腾讯云开发者
