我正在尝试编写一个小型Web应用程序:列出用户名和编号
这些文件位于同一文件夹中,例如:
ang8
|---- index.html
|---- list.html
|---- contacts.js
当我尝试打开index.html时,它不会加载list.html中的内容.任何的想法？？谢谢!
index.html代码是:
<!DOCTYPE html>
<html ng-app="contacts">
<meta character="utf-8">
<title>Contacts</title>
<style type="text/css">
* { box-sizing: border-box; }
body { font: 14px/1.5 sans-serif; color: #222; margin: 3em;}
</style>
<div ng-controller="Contacts">
<h1>Contacts</h1>
<div ng-view></div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<script src="contacts.js"></script>
</html>
list.html代码:
<h2>List</h2>
<div>
<label>search: </label><input type="search" ng-model="search">
<br>
</div>
<ul>
<li ng-repeat="contact in contacts | filter:search">
<a href="#/contact/{{$index}}">{{contact.name}}</a>
: {{contact.number}}
</li>
</ul>
和js代码:
angular
.module('contacts', [])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'list.html'
});
})
.controller('Contacts', function($scope){
$scope.contacts = [
{name: 'Tom', number: '1234'},
{name: 'David', number: '4321'},
{name: 'Jason', number: '12345'}
];
})
Angular无法找到ngRoute依赖关系.你错过了对它的引用angular-route(.min).js.在angular.min.js引用下面添加以下行:
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.min.js"></script>
| 归档时间： |
|
| 查看次数： |
8164 次 |
| 最近记录： |