控制器
最后更新于：2022-04-01 01:07:42
* 不要在控制器里操作 DOM。通过指令完成。
* 通过控制器完成的功能命名控制器 (如：购物卡，主页，控制板)，并以字符串`Ctrl`结尾。控制器采用驼峰命名法 (`HomePageCtrl`, `ShoppingCartCtrl`, `AdminPanelCtrl`, etc.).
* 控制器不应该在全局中定义 (尽管 AngularJS 允许，但污染全局空间是个糟糕的实践)。
* 使用一下语法定义控制器：
~~~
function MyCtrl(dependency1, dependency2, ..., dependencyn) {
// ...
}
module.controller('MyCtrl', MyCtrl);
~~~
使用这种定义方式可以最大的避免问题。你可以使用工具自动生成数组定义，如：[ng-annotate](https://github.com/olov/ng-annotate) (and grunt task [grunt-ng-annotate](https://github.com/mzgol/grunt-ng-annotate)).
* 使用控制器依赖的原名。这将提高代码的可读性：
~~~
function MyCtrl(s) {
// ...
}
module.controller('MyCtrl', ['$scope', MyCtrl]);
~~~
下面的代码更易理解
~~~
function MyCtrl($scope) {
// ...
}
module.controller('MyCtrl', ['$scope', MyCtrl]);
~~~
对于包含大量代码的需要上下滚动的文件尤其适用。这可能使你忘记某一变量是对应哪一个依赖。
* 尽可能的精简控制器。将通用函数抽象为独立的服务。
* 通过方法引用进行跨控制器通讯 (通常是子控制器与父控制器通讯) 或者 `$emit`, `$broadcast` 及 `$on` 方法。发送或广播的消息应该限定在最小的作用域。
* 制定一个通过 `$emit`, `$broadcast` 发送的消息列表并且仔细的管理以防命名冲突和bug。
* 在需要格式化数据时将格式化逻辑封装成 [过滤器](https://github.com/mgechev/angularjs-style-guide/blob/master/README-zh-cn.md#filters) 并将其声明为依赖：
~~~
function myFormat() {
return function () {
// ...
};
}
module.filter('myFormat', myFormat);
function MyCtrl($scope, myFormatFilter) {
// ...
}
module.controller('MyCtrl', MyCtrl);
~~~
* 当内嵌的控制器 使用 "内嵌 scoping" ( `controllerAs` 语法):
**app.js**
~~~
module.config(function ($routeProvider) {
$routeProvider
.when('/route', {
templateUrl: 'partials/template.html',
controller: 'HomeCtrl',
controllerAs: 'home'
});
});
~~~
**HomeCtrl**
~~~
function HomeCtrl() {
this.bindingValue = 42;
}
~~~
**template.html**
~~~
<div ng-bind="home.bindingValue"></div>
~~~