Angularjs 为什么父状态必须是抽象的_Angularjs_Angularjs Routing

Angularjs 为什么父状态必须是抽象的

angularjs

Angularjs 为什么父状态必须是抽象的,angularjs,angularjs-routing,Angularjs,Angularjs Routing,为什么父视图必须是抽象的才能呈现子视图（嵌套视图） $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

为什么父视图必须是抽象的才能呈现子视图（嵌套视图）

$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中，如下所示：

<!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”被标记为abstract=false，则不会呈现ui视图内容。

我也遇到过类似的问题

您的三个州都使用相同的URL，/A:

A：“/A”
A.B：“/A”+”
A.B.C：“/A”+”

由于它们定义了URL，将根据当前URL选择当前状态。您一次只能处于一个状态，因此所选择的状态可能是首先定义的状态

如果将A和A.B状态抽象化，则无法将它们转换为，因此在浏览到/A时不会考虑它们。因此，选择A.B.C，从A.B和A继承

如果您希望一次显示多个视图，那么我建议您阅读的文档，以便于跟踪。

假设您的应用程序页面为home.html，并且父视图a的模板位于views/a.html。。。您应该共享视图/A.html和视图/B.html，这样我们就可以看到子视图是如何放置到父视图中的。