I 了解新语法 http://docs.angularjs.org/guide/concepts#controller来自 AngularJS 关于controller as xxx
语法InvoiceController as invoice告诉 Angular 实例化
控制器并将其保存在当前的可变发票中
范围。
可视化：
好的，所以我不会有参数$scope在我的控制器中，控制器中的代码会更加清晰。
But
我必须指定另一个别名在视图中
所以到目前为止我可以做：
<input type="number" ng-model="qty" />
....controller('InvoiceController', function($scope) {
// do something with $scope.qty <--notice
现在我可以做：
<input type="number" ng-model="invoic.qty" /> <-- notice
....controller('InvoiceController', function() {
// do something with this.qty <--notice
Question
这样做的目的是什么？从一个地方删除并添加到另一个地方？
我会很高兴看到我错过了什么。
关于它有几件事。
有些人不喜欢$scope语法（不要问我为什么）。他们说他们可以使用this。这是目标之一。
明确财产的来源也非常有用。
您可以嵌套控制器，并且在阅读 html 时，每个属性的来源都非常清楚。
你也可以avoid一些dot rule问题。
例如，有两个控制器，都具有相同的名称“name”，您可以这样做：
<body ng-controller="ParentCtrl">
<input ng-model="name" /> {{name}}
<div ng-controller="ChildCtrl">
<input ng-model="name" /> {{name}} - {{$parent.name}}
</div>
</body>
您可以修改父级和子级，这没有问题。但你需要使用$parent查看父级的名字，因为您在子控制器中隐藏了它。在海量的html代码中$parent可能有问题，你不知道这个名字是从哪里来的。
With controller as你可以做：
<body ng-controller="ParentCtrl as parent">
<input ng-model="parent.name" /> {{parent.name}}
<div ng-controller="ChildCtrl as child">
<input ng-model="child.name" /> {{child.name}} - {{parent.name}}
</div>
</body>
同样的例子，但读起来更清晰。
- $scope plunker http://plnkr.co/edit/OvxVZGLGxerGIh73giiR?p=preview
- controller as plunker http://plnkr.co/edit/VmqLvjGE7DyLOi6MJgfA?p=preview
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
