【发布时间】：2015-10-21 09:50:37
【问题描述】：
我有一个索引页和三个部分视图。索引页面使用 ng-view 动态加载部分视图。部分视图称为 TestPartial1.html、TestPartial2.html 和 BothPartials.html。 BothPartials.html 包含 TestPartial1.html 和 TestPartial2.html，因此当点击 BothPartials 链接时，ng-view 会调用 BothPartials.html，它应该同时加载 TestPartial1.html 和 TestPartial2.html。
我可以分别调用和显示 TestPartial1.html 和 TestPartial2.html，但我不知道如何通过 BothPartials.html 一起显示两个页面。我曾尝试在 BothPartials.html 中使用 ng-include 来加载 TestPartial1 和 TestPartial2 但无济于事。
我的代码如下：
Index.aspx
<body ng-app="myApp">
<div ng-view id="ng-view"></div>
</body>
TestPartial1.html
<div>
<h1>View 1</h1><br />
<a href="#View2">View2</a>
</div>
TestPartial2.html
<div>
<h1>View 2</h1><br />
<a href="#View1">View1</a>
<a href="#BothViews">Both Views</a>
</div>
BothPartials.html
<div>
<br />
<br />
test
<div ng-include = "TestPartial1.html"></div>
<div ng-include = "TestPartial2.html"></div>
</div>
App.js
(function () {
var myApp = angular.module('myApp', ['ngRoute']);
myApp.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/Index.aspx', {
templateUrl: 'PartialViews/TestPartial1.html'
})
.when('/View1', {
templateUrl: 'PartialViews/TestPartial1.html'
})
.when('/View2', {
templateUrl: 'PartialViews/TestPartial2.html'
})
.when('/BothViews', {
templateUrl: 'PartialViews/BothPartials.html'
})
.otherwise({ redirectTo: '/Index.aspx' });
}]);
}
)();
【问题讨论】：
-
可能是因为您的
ng-include是相对路径。试试绝对路径：ng-include="/PartialViews/TestPartial1.html" -
如果你想要多个视图，长期使用 ui-router 可能会更好
-
@Coop 我尝试了以下不同的组合，但没有用：“~/Restricted/PartialViews/TestPartial1.html”、“/PartialViews/TestPartial1.html”、“/TestPartial1.html”跨度>
-
控制台中是否可见错误？
-
@Coop，控制台没有错误。我接受了莫里西的建议并使用了 ui-router。感谢您的帮助。