ng-未在引导页面中加载视图
ng-未在引导页面中加载视图
提问于 2021-01-12 01:53:34
这是我的index.html页面。未路由red.html、green.html和blue.html页面。
我确信这是代码中令人尴尬的语法错误，作为一个初学者，我忽略了这个错误，请帮助我。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-animate.js"></script>
</head>
<body ng-app="myApp">
<div class="list-group">
<a href="#/!" class="list-group-item">Main</a>
<a href="#!red"
class="list-group-item">Red </a>
<a href="#!blue"
class="list-group-item">Blue</a>
<a href="#!green"
class="list-group-item">Green</a>
</div>
<div ng-view>
</div>
<script>
var app=angular.module("myApp",["ngRoute"]);
app.config(["$routeProvider",function($routeProvider) {
$routeProvider
.when("/", {
templateUrl : "main.html"
})
.when("/red", {
templateUrl : "red.html"
})
.when("/green", {
templateUrl : "green.html""
})
.when("/blue", {
templateUrl : "blue.html"
})
}]);
</script>
</body>回答 1
Stack Overflow用户
发布于 2021-01-12 02:34:41
您有两个错误。如果您打开浏览器devtools并查看控制台，您可以同时看到它们。第一个是语法错误：
.when("/green", {
templateUrl : "green.html""
})你有一个额外的结束引号，它应该是
.when("/green", {
templateUrl : "green.html"
})第二个错误的this link很好地解释了另一个问题:在v1.2.0中，ngRoute是从主角度包中分离出来的，所以您需要单独加载它：
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js""></script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65672089
复制相关文章
相似问题
腾讯云开发者
