【发布时间】:2019-10-27 03:38:19
【问题描述】:
我调用 ng-view,但程序从不呈现我的 home.html 或 cart.html 页面。如何让 ng-view 工作?
我尝试使用多种类型的引用。我以不同的方式调用了 ng-view,但似乎没有任何效果。
<!--My home.html:-->
<h2> HOME </h2>
<h1>{{message}}</h1>
<!--My cart.html:-->
<h2> CART </h2>
<h1>{{message2}}</h1>
下面是我的 index.html 和 app.js
var myApp = angular.module('myApp', ['ngRoute']);
myApp.config(['$routeProvider', function($routeProvider){
$routeProvider.
when('/home', {
templateUrl: 'views/home.html',
controller: 'homeController'
})
when('/cart', {
templateUrl: 'views/cart.html',
controller: 'cartController'
})
otherwise({
redirect: '/home'
});
}]);
myApp.controller('homeController', function($scope) {
$scope.message = 'Home Page';
})
myApp.controller('cartController', function($scope){
$scope.message2 = 'Cart Page';
})
<!DOCTYPE html>
<html>
<head>
<title>Test Web App</title>
<meta chrset="utf-8">
<script src="lib/angular-route.js"></script>
<script src="lib/angular.js"></script>
<script src="lib/app.js"></script>
</head>
<body ng-app="myApp">
<center><h1>Shopping Cart App</h1></center>
<tr><td class="menu">
<a href="#/home">Home</a>
<a href="#/cart">Cart</a>
</td></tr>
<dev ng-view></dev>
</body>
</html>
我希望当点击主页链接或购物车链接时,ng-view 会呈现它们的模板。
【问题讨论】:
-
.config块有语法错误。第二个when方法需要是点符号属性访问器。与otherwise方法相同。
标签: html angularjs ngroute ng-view