0
我一直在研究本教程“AngularJSDemos”Dan Wahlin链接https://www.youtube.com/watch?v=i9MHigUZKEM，但应用SPA AngularJS并未在网页上呈现。我的代码中是否有缺少的内容？AngularJS不在网页上呈现“AngularJSDemos”Dan Wahlin
HTML页面有以下代码： “使用AngularJS指令和数据绑定”
<!DOCTYPE html>
<html data-ng-app="demoApp">
<head>
<title>Using AngularJS Directives and Data Binding</title>
</head>
<body>
<div>
<!--Placeholder for views-->
<div data-ng-view=""></div>
</div>
<script src="Scripts/angular.min.js"></script>
<script>
var demoApp = angular.module('demoApp', []);
demoApp.config(function ($routeProvider) {
$routeProvider
.when('/view1',
{
controller: 'SimpleController',
templateUrl: 'Partials/View1.html'
})
.when('/view2',
{
controller: 'SimpleController',
templateUrl: 'Partials/View2.html'
})
.otherwise({ redirectTo: '/view1' });
});
demoApp.factory('simpleFactory', function() {
var customers = [
{ name: 'John Smith', city: 'Phoenix' },
{ name: 'Jane Doe', city: 'San Francisco' },
{ name: 'John Doe', city: 'New York' },
{ name: 'Mike Leski', city: 'Clarksburg' },
];
var factory = {};
factory.getCustomers = function() {
return customers;
};
factory.postCustomer = function (customer) {
};
return factory;
});
demoApp.controller('SimpleController', function ($scope, simpleFactory) {
$scope.customers = [];
init();
function init() {
$scope.addCustomer = simpleFactory.getCustomers();
}
$scope.addCustomer = function() {
$scope.customers.push(
{
name: $scope.newCustomer.name,
city: $scope.newCustomer.city
});
};
});
</script>
的View1.html
<div class="container">
<h2>View 1</h2>
Name:
<br />
<input type="text" data-ng-model="filter.name" />
<br />
<ul>
<li data-ng-repeat="cust in customers | filter:filter.name | orderBy:'city'">{{ cust.name | uppercase}} - {{ cust.city | lowercase}}</li>
</ul>
<br />
Customer Name:<br />
<input type="text" data-ng-model="newCustomer.name"/>
<br />
Customer City:<br />
<input type="text" data-ng-model="newCustomer.city" />
<br />
<button data-ng-click="addCustomer()">Add Customer</button>
<br />
<a href="#/view2">View 2</a>
</div>
，最后一个View2.html
<div class="container">
<h2>View 2</h2>
City:
<br />
<input type="text" data-ng-model="city" />
<br />
<ul>
<li data-ng-repeat="cust in customers | filter:city | orderBy:'city'">{{ cust.name | uppercase}} - {{ cust.city | lowercase}}</li>
</ul>
</div>