UI路由器为什么父状态必须是抽象的 [英] ui-router Why parent states must be abstract
问题描述
为什么父母的意见都必须以有孩子的意见摘要(嵌套视图)呈现?
Why parent views have to be abstract in order to have child views (nested views) rendered?
$stateProvider
.state('A', {url: '/A', abstract: true, templateUrl: 'views/A.html'})
.state('A.B', {url: '', abstract: true, templateUrl: 'views/B.html'})
.state('A.B.C', {url:'', abstract:false, templateUrl:'views/C.html'});
父视图A中home.html的托管如下:
The parent view 'A' is hosted in home.html as follow:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Yomingo</title>
<link href="lib/bootstrap/css/bootstrap.css" rel="stylesheet"/>
<link href="lib/bootstrap/css/bootstrap-responsive.css" rel="stylesheet"/>
</head>
<body>
<div ui-view>
</div>
<script type="text/javascript" data-main="scripts/main" src="lib/require/require.js"></script>
</body>
</html>
如果任何父国A或B的被标记为抽象=假UI视图内容不渲染。
If any of the parent states 'A' or 'B' is marked as abstract=false the ui-view content is not rendered.
推荐答案
我一直有类似的麻烦。
您三种状态都使用相同的URL,/ A:
Your three states are all using the same URL, /A:
- A :'/ A'
- A·B :'/ A'+''
- A.B.C :'/ A'+''+''
- A: '/A'
- A.B: '/A' + ''
- A.B.C: '/A' + '' + ''
由于他们定义的URL,目前国家将根据您当前的URL来选择。你只能在一个状态的时间,所以presumably被选择的状态是第一个定义的。
As they have URLs defined, the current state will be chosen based on your current URL. You can only be in one state at a time, so presumably the state that is chosen is the one defined first.
如果你让A和A·B规定的抽象那么他们不能过渡到,所以当你浏览/ A将不被考虑。因此A.B.C选择,从A·B和A继承。
If you make the A and A.B states abstract then they cannot be transitioned into and so will not be considered when you browse to /A. Thus A.B.C is chosen, inheriting from A.B and A.
如果您正在寻找来展示你的观点在时间,那么我会推荐阅读文档的的 多个命名视图,使其更容易跟踪。
If you are looking to show more that one of your views at a time then I would recommend reading the docs for multiple named views to make it easier to keep track of.
这篇关于UI路由器为什么父状态必须是抽象的的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!