Page 39 - AngularJS权威教程

5.1 控制器嵌套（作用域包含作用域） 19

值，就好像person对象定义在ChildController的$scope中一样。 1

2

3

4

5
图5-2 控制器嵌套

控制器应该尽可能保持短小精悍，而在控制器中进行DOM操作和数据操作则是一个不好的
实践。 6
例如，下面这个例子中的控制器包含了过于臃肿的逻辑用于控制视图，并且还操作了DOM。
7
臃肿的控制器：

angular.module('myApp', []) 8
.controller('MyController', function($scope) {
$scope.shouldShowLogin = true;
$scope.showLogin = function () { 9
$scope.shouldShowLogin = !$scope.shouldShowLogin;
};
$scope.clickButton = function() {
$('#btn span').html('Clicked'); 10
};
$scope.onLogin = function(user) {
$http({ 11
method: 'POST',
url: '/login',
data: {
user: user 12
}
}).success(function(data) {
// user 13
});
};
});
14
设计良好的应用会将复杂的逻辑放到指令和服务中。通过使用指令和服务，我们可以将控制
器重构成一个轻量且更易维护的形式：
15
简洁的控制器：

angular.module('myApp', []) 16
.controller('MyController', function($scope,UserSrv) {
// 内容可以被指令控制
$scope.onLogin = function(user) { 17
UserSrv.runLogin(user);
};
});
18