我是角度 js 的新手。我正在尝试构建一个简单的应用程序,如果我通过 ng-route 加载它无法找到 view1.html,而如果我从同一个 index.html 加载它可以工作。我已经通过以下帖子遇到了同样的问题,我们在其中注入了 ng-route 的 ibrary 依赖项,但它仍然无法正常工作
index.html
<!DOCTYPE html>
<html ng-app="demo">
<head >
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"> </script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular-route.min.js">
</script>
</head>
<body> Test
<div ng-view=""> </div>
<script>
var demo = angular.module('demo',['ngRoute']);
demo.config(function($routeProvider) {
$routeProvider.when('/',
{
controller:'showswitch',
templateUrl: 'view1.html'
})
.otherwise({redirectTo:'/'})
});
demo.controller('showswitch', function($scope) {
$scope.phones = [
{'name': 'Nexus S',
'snippet': 'Fast just got faster with Nexus S.',
'age': 1},
{'name': 'Motorola XOOM™ with Wi-Fi',
'snippet': 'The Next, Next Generation tablet.',
'age': 2},
{'name': 'MOTOROLA XOOM™',
'snippet': 'The Next, Next Generation tablet.',
'age': 3}
];
});
</script>
</body>
</html>
(view1 和 index 在同一目录下)
view1.html
<div>
<h1> View1 </h1>
<input ng-model="query">
<select ng-model="orderProp">
<option value="name">Alpha</option>
<option value="age">Age</option>
</select>
<ul class="phones">
<li ng-repeat="phone in phones | filter:query | orderBy:orderProp">
<span>{{phone.name}}</span>
<p>{{phone.snippet}}</p>
</li>
</ul>
</div>