我正在尝试学习 AngularJS，但我的第一个应用程序遇到了一些问题。我想使用 ng-view 将 html 文件分配给不同的链接，但是当我单击链接时没有任何反应。我肯定错过了什么。
索引.html
<!doctype html>
<html lang="en" ng-app="customerApp" ng-controller="customerControllers" >
<head>
<title>Customer Demo App</title>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-route.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
</head>
<body>
<ul class="nav">
<li><a href="#/CustomerList"> List Customers </a></li>
<li><a href="#/CustomerForm"> Add/Edit Customer </a></li>
</ul>
<div ng-view></div>
</body>
</html>
js/app.js
/* 应用模块 */
var customerApp = angular.module('customerApp', ['ngroute', 'customerControllers' ]);
customerApp.config([$routeProvider,
function ($routeProvider) {
$routePRovider.
when('/CustomerForm',{
templateUrl: 'partials/customer-form.html',
controller: 'customerCtrl'
}).
when('/CustomerList',{
templateUrl: 'partials/customer-list.html',
controller: 'customerLstCtrl'
}).
otherwise({
redirectTo: '/CustomerForm'
});
}]);
js/controller.js
customerApp.controller('customerCtrl', ['$scope', function($scope) {
$scope.heading = 'Add / Edit Customer';
});
customerApp.controller('customerLstCtrl', ['$scope', function($scope) {
$scope.heading = 'Customer List';
});
部分/客户-form.html
<h1>{{heading}}</h1>
<div>
<form>
<label>Name</label>
<input type="text" ng-model="customer.name" /></br>
<lablel>Email</lablel>
<input type="text" ng-model="customer.email"/></br>
<label>Telephone</label>
<input type="text" ng-model="customer.phone"/></br>
<label>Address</label>
<label>Street</label>
<input type="text" ng-model="customer.street" /></br>
<label>City</label>
<input type="text" ng-model="customer.city"/></br>
<label>State</label>
<input type="text" ng-model="customer.state"/></br>
<label>Zip</label>
<input type="text" ng-model="customer.zip"/></br>
</form>
</p>{{customer}}</p>
</div>
部分/客户列表.html
<h1>{{heading}}</h1>