尝试复制一个简单的路由示例 w3schools ,但在访问 index.html 时,它不断崩溃,并在控制台中显示“RangeError:超出最大调用堆栈大小”。
我尝试添加/删除部分代码来隔离问题,崩溃似乎发生在 <div ng-view></div>
。这是为什么?我对原始示例所做的更改并没有那么大。
这是代码
index.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="myApp">
<a href="#!red">Red</a>
<a href="#!green">Green</a>
<div ng-view></div>
</body>
</html>
app.js
var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
$routeProvider
.when("/", {
templateUrl : "index.html"
})
.when("/red", {
templateUrl : "red.html"
})
.when("/green", {
templateUrl : "green.html"
});
});
red.html
This is red
green.html
This is green
最佳答案
是的,index是其他 View 的容器。您应该放置部分 View 而不是索引。问题出在这里:
$routeProvider
.when("/", {
templateUrl : "index.html"
})
该模板 url 将在 ng-view 中加载完整的 index.html,这将加载另一个带有新 ng-view 的 index.html 到无限和 Secula Seculorum。
简单的解决方法:创建一个新 View (就像您拥有的其他路由一样)并将其放入 templateUrl
关于javascript - ng-view 导致页面崩溃,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46029120/