简介
我使用 AngularJS 和 AngularUI 模块来构建具有多个 View 的管理界面。
我有一个简单的公共(public)页面布局,其中有一个 ui View ,另一个用于管理页面,有四个 ui View (页眉、侧边栏、主视图、页脚)。
问题
我遇到的问题是,如果我设置 ui-view main 公共(public)状态将不会显示登录 View ,但如果我不设置 ui-view main 公共(public)状态将显示登录 View 。页眉、侧边栏和页脚适用于任何设置。即使我尝试设置绝对名称,某些设置似乎会覆盖另一个设置。有人可以解释一下这是怎么回事吗?
- ui-view="main"==> 登录不显示
- ui-view=""==> 登录显示
视觉布局:
源代码(index.html):
<body>
...
<div ui-view="public">
</div>
<div class="admin">
<div ui-view="header"></div>
<div ui-view="sidebar"></div>
<div class="container" style="margin-top:60px" ui-view="">
<!-- ^ add main here -->
</div>
<div ui-view="footer"></div>
</div>
...
</body>
代码示例
我设置了一个最小的完整代码示例来概述问题:
最佳答案
我稍微玩了一下你的演示,并查看了 ui-router documentation .
如果您如下所示更改“公开”状态,那么它似乎有效。
原文:
.state('public', {
url: '/login',
title: 'Login',
templateUrl: 'login.html'
})
更新:
.state('public', {
url: '/login',
views: {
'main@': {
title: 'Login',
templateUrl: 'login.html'
}
}
})
这是一个更新的 plunkr: http://plnkr.co/edit/okBWMPpWysS9srKrcxeG?p=preview
这是您想要做的事情,还是您正在尝试将登录
设置为嵌套 View ?
关于javascript - 不同的状态不显示 ui-views,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21296426/