角度ui路由器：父级和子级视图
我想用以下结构构建一个站点header-view，main-view，footer-
view。因此，我定义了一个包含页眉和页脚的根路由。root的子代将是我的全部站点。在这些站点中，我将拥有更多的嵌套视图。
在下面的代码中，它确实显示了页眉，但未显示页脚和主视图。一旦删除父级继承，它将显示主视图，但不显示页眉和页脚。
的HTML
<body ng-app="App">
<header ui-view="header"></header>
<main ui-view></ui-view>
<footer ui-view="footer"></footer>
</body>
JS
module.config(function($urlRouterProvider, $stateProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('root', {
abstract: true,
views: {
'@': {
controller: 'RootCtrl',
controllerAs: 'rootCtrl'
},
'header@': {
templateUrl: 'modules/header/header.html',
controller: 'HeaderCtrl',
controllerAs: 'headerCtrl'
},
'footer@': {
templateUrl: 'modules/footer/footer.html',
controller: 'FooterCtrl',
controllerAs: 'footerCtrl'
}
}
})
.state('root.home',{
parent:'root',
url:'',
templateUrl:'modules/home/home.html',
controller: 'HomeController',
controllerAs:'homeCtrl'
});
});
问题答案：
有一个与正在工作的矮人有关的链接。
该UI-Router逻辑如何找到一个视图的目标/锚： 总是试图插入child到parent。如果不可能，请使用绝对命名。看到：
[视图名称-相对名称与绝对名称](https://github.com/angular-ui/ui-router/wiki/Multiple-
Named-Views#view-names—relative-vs-absolute-names)
因此，我更改的是，父未命名视图现在包含子对象的目标/锚点-未命名视图<ui-view />：
.state('root', {
abstract: true,
views: {
'@': {
template: '<ui-view />', // NEW line, with a target for a child
controller: 'RootCtrl',
controllerAs: 'rootCtrl'
},
....
另外，因为我们说过，默认网址是
$urlRouterProvider.otherwise('/home');
我们必须有这样的状态：
.state('root.home',{
parent:'root',
url:'/home', // this is the otherwise, to have something on a start up
在这里检查
此处使用unk子的另一种方法可能是针对子级的根视图：
.state('root.home',{
parent:'root',
url:'/home',
views: {
'@': {
templateUrl:'home.html',
controller: 'HomeController',
controllerAs:'homeCtrl'
}
},
在这种情况下，父状态不是必须的<ui-view />-我们以root 为目标，但我们不会继承任何东西…为什么呢？看到这个链接：
[仅按视图层次结构的作用域继承](https://github.com/angular-ui/ui-router/wiki/Nested-
States-%26-Nested-Views#scope-inheritance-by-view-hierarchy-only)
-
问题内容： 我有以下情况： index.html页面加载有角并包含：ui-view layout.html页面包含左侧菜单，该菜单可解析来自服务器的数据 homepage.html使用layout.html作为其父项，但需要从服务器解析其自己的数据。 问题是：当我解决父问题时，孩子无法解决问题；当我删除父问题时，孩子解决问题。 您能帮我，让我知道我做错了吗？ app.js 问题答案： 一项功能应同
-
问题内容： 我有一个 父母 州和许多孩子州。如果我希望在与孩子中的一个孩子在一起时在父母上工作，则需要执行此“ hack”操作： 这是非常丑陋的方式，我有很多孩子，所以这似乎不是很好的解决方案。有人对此问题有其他解决方案吗？ 问题答案： 您只能检查而不是检查状态
-
问题内容： 以故事形式： 我在这里寻找的是主从设置。母版是列表形式的，当我单击一个链接（相对于特定的行/记录（在这种情况下为Account））时，我想在主视图（直译为“主”视图：）中查看详细信息。 我想这样做并维护我的URL结构（用于帐户列表；用于详细版本）， 但是我希望详细视图使用列表正在使用的视图 。 我目前有什么 index.html account.js 此时，该路线将按预期工作。它在视图
-
问题内容： 使用ui- router并将父状态URL设置为导致我的URL看起来像在查看子页面时一样。我只想在散列和子项之间添加一个。 我尝试将父状态网址保留为空白，但是使用锚链接时，ui-sref不会链接回父状态。有人知道使用根级别未命名的父URL的解决方案吗？ app.config child.config 问题答案： 将有解决方案 _（几乎）_任何东西。有一个工作的plnkr。我们将要使用的功
-
问题内容： 角度ui路由器的示例演示在起始页面具有以下链接： “ ui-router”的完整网址为或 “关于”的完整网址为或 当我使用durandalJS时，存在一个限制，即默认URL只是“ /”，不能有“ / ui-router”。 Angular ui路由器插件有相同的限制吗？ 问题答案： 请参阅此处，默认路由有一个“其他”选项。
-
我试图找出是否有一个更优化的方法在两个兄弟孩子路由之间共享同一个解析器。下面是一个路由与解析器相关的示例。 现在，我正在为每个子路由重复解析器调用，我认为这不是最优的。有人知道有没有更好的方法来共享来自共享同级子解析器的数据吗？我考虑将来自重复解析器的数据设置为共享服务，然后另一个子同级路由将访问来自服务的数据（而不是在解析器中进行另一个api调用）。还有其他更好的解决方案吗？