Angular 中的路线无效
Routes in Angular Not working
代码
<body ng-app="ngapp">
<h2>NG App</h2>
<div>
<ng-view></ng-view>
</div>
<script src="Scripts/angular.min.js"></script>
<script>
var app = angular.module('ngapp', ["ngRoute"]);
app.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'Page1.html',
controller: 'simpCtrl'
})
.when('/view2', {
templateUrl: 'Page2.html',
controller: 'simpCtrl'
});
});
app.controller('simpCtrl', function ($scope) {
$scope.customers = [
{ name: 'Jack', age: 10 },
{ name: 'Abdul', age: 12 },
{ name: 'Zubair', age: 11 },
{ name: 'Ammar', age: 10 }
];
});
</script>
我已经正确注册了路由,但它不起作用,我不知道为什么。知道如何在 angular 中调试或查找行为异常的代码吗?
Page1.html
<div>
<h2>View 1</h2>
Customer Name:
<input type="text" ng-model="search.name" />
<ul>
<li ng-repeat="n in customers | orderBy:'name' | filter:search:strict ">{{n.name|uppercase}} - {{n.age}}
</li>
</ul>
<a href="#/Page2.html">View 2</a>
谢谢
您的应用程序几乎没有问题,
(i) 你指的是 angular2 库,像这样改变它
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js"></script>
(ii) 您还没有为 ngRoute 添加引用
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.4/angular-route.js"></script>
代码
<body ng-app="ngapp">
<h2>NG App</h2>
<div>
<ng-view></ng-view>
</div>
<script src="Scripts/angular.min.js"></script>
<script>
var app = angular.module('ngapp', ["ngRoute"]);
app.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'Page1.html',
controller: 'simpCtrl'
})
.when('/view2', {
templateUrl: 'Page2.html',
controller: 'simpCtrl'
});
});
app.controller('simpCtrl', function ($scope) {
$scope.customers = [
{ name: 'Jack', age: 10 },
{ name: 'Abdul', age: 12 },
{ name: 'Zubair', age: 11 },
{ name: 'Ammar', age: 10 }
];
});
</script>
我已经正确注册了路由,但它不起作用,我不知道为什么。知道如何在 angular 中调试或查找行为异常的代码吗?
Page1.html
<div>
<h2>View 1</h2>
Customer Name:
<input type="text" ng-model="search.name" />
<ul>
<li ng-repeat="n in customers | orderBy:'name' | filter:search:strict ">{{n.name|uppercase}} - {{n.age}}
</li>
</ul>
<a href="#/Page2.html">View 2</a>
谢谢
您的应用程序几乎没有问题,
(i) 你指的是 angular2 库,像这样改变它
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js"></script>
(ii) 您还没有为 ngRoute 添加引用
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.4/angular-route.js"></script>