安古拉杰
安古拉杰
提问于 2015-03-09 15:21:34
我正在尝试使用ngRoute与customers.html结婚，customersController.js在index.html加载时出现在视图中。
它应该显示一个表中的客户列表以及其他一些属性。
它所显示的是一种局部的观点。
代码的链接：http://plnkr.co/YzZ3ldemD8UHH0R16BNi
index.html有以下代码
<!DOCTYPE html>
<html ng-app="customersApp">
<head>
<title>Testing ngRoute</title>
</head>
<body>
<div ng-view></div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular-route.min.js"></script>
<script src="app.js"></script>
<script src="customersController.js"></script>
</body>
</html>app.js有以下代码
(function() {
var app = angular.module('customersApp', ['ngRoute']);
app.config(function($routeProvider){
$routeProvider
.when('/', {
controller: 'CustomersController',
templateUrl: 'customers.html'
})
.otherwise( { redirectTo: '/' });
});
}());customersController.js有以下代码
app.controller('CustomersController', function ($scope){
$scope.sortBy= 'name';
$scope.reverse = false;
$scope.customers=[{joined: '2000-12-02', name:'John', city:'Sacramento', orderTotal:7.554},
{joined: '2012-12-07', name:'Tom', city:'Chandler', orderTotal:110.57},
{joined: '1997-05-02', name:'Matt', city:'Michigan', orderTotal:19.993},
{joined: '2001-10-08', name:'Jane', city:'New York', orderTotal:112.954}];
$scope.doSort = function(propName){
$scope.sortBy = propName;
$scope.reverse = !$scope.reverse;
};
});Customers.html(视图)有以下代码
<h2>Customers</h2>
Filter: <input type="text" ng-model="customersFilter.name"/>
<br /><br />
<table>
<tr>
<th ng-click="doSort('name')">Name</th>
<th ng-click="doSort('city')">City</th>
<th ng-click="doSort('orderTotal')">Order Total</th>
<th ng-click="doSort('joined')">Joined</th>
</tr>
<tr ng-repeat="cust in customers | filter:customersFilter | orderBy:sortBy:reverse">
<td>{{cust.name}}</td>
<td>{{cust.city}}</td>
<td>{{cust.orderTotal | currency}}</td>
<td>{{cust.joined | date:'longDate'}}</td>
</tr>
</table>
<br />
<span>Total customers: {{customers.length}}</span>回答 1
Stack Overflow用户
回答已采纳
发布于 2015-03-09 18:20:56
当你解决生活问题时，应用变量会留下作用域。所以当你试图将控制器附加到它上时，它就不再存在了。将控制器更改为angular.module('customersApp').controller('CustomersController', function ($scope){
顺便提一句，控制器也可以被包裹在生活中！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28945627
复制相关文章
相似问题
腾讯云开发者
