app.controller VS在angular.js功能 [英] app.controller vs function in angular.js
问题描述
我学习angular.js，而不知何时 app.controller（MyCtrl，...）应使用时功能MyCtrl（$范围）{...} 应该被使用。
我看到了两种方法之间在这个例子中（链接到一个plunker ）没有什么大的区别
的index.html
＆LT;机身NG-应用=对myApp＆GT; ＆LT; DIV NG控制器=FirstCtrl为APP1＆GT;
＆LT;按钮类=BTNNG模型=app1.count
NG-点击=app1.increment（）＆GT;
点击递增和LT; /按钮＆GT;
{{app1.count}}
＆LT; / DIV＆GT; ＆LT; DIV NG控制器=SecondCtrl＆GT;
＆LT;按钮类=BTNNG模型=计数
NG-点击=增量（）＆GT;
点击递增和LT; /按钮＆GT;
{{数}}
＆LT; / DIV＆GT; ＆LT;脚本类型=文/ JavaScript的SRC =https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的SRC =example.js＆GT;＆LT; / SCRIPT＆GT;
＆LT; /身体GT;
example.js
VAR应用= angular.module（对myApp，[]）;app.controller（FirstCtrl功能（）{
this.count = 0;
this.increment =功能（）{
this.count = this.count + 1;
}
}）;功能SecondCtrl（$范围）{
$ scope.count = 0;
$ scope.increment =功能（）{
$ scope.count = $ scope.count + 1;
}
}
在这两个你用法，推荐的方法是注入 $范围和使用（而不是使用这个，您可以在第二个方法做的一样好）。
方法之一，这两者之间的区别在于如何支持缩小。在前者，你可以提供的注射参数数组，而后者则修改 $注。当然，这是一个有点技术，但强烈建议，以支持缩小。请参见了一份关于微小的文件中。
前者也没有名字在全球范围内的功能，这通常是一个好东西！
I'm learning angular.js, and wonder when app.controller("MyCtrl",...) should be used and when function MyCtrl($scope){...} should be used.
I see no big differences between the two approaches in this example (link to a plunker):
index.html:
<body ng-app="myApp">
<div ng-controller="FirstCtrl as app1">
<button class="btn" ng-model="app1.count"
ng-click="app1.increment()">
Click to increment</button>
{{ app1.count }}
</div>
<div ng-controller="SecondCtrl">
<button class="btn" ng-model="count"
ng-click="increment()">
Click to increment</button>
{{ count }}
</div>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
<script type="text/javascript" src="example.js"></script>
</body>
example.js:
var app = angular.module("myApp", []);
app.controller("FirstCtrl",function () {
this.count = 0;
this.increment = function (){
this.count = this.count + 1;
}
});
function SecondCtrl($scope){
$scope.count = 0;
$scope.increment = function (){
$scope.count = $scope.count + 1;
}
}
In both of your usages, the recommended approach is to inject $scope and use that (rather than using this, which you can do in the second approach as well).
The difference between approach one and two is in how to support minification. In the former, you can supply an array of injected arguments, whereas in the latter you modify $inject. This is of course a bit technical but it is highly recommended to support minification. See A note on minification in the documentation.
The former also does not name the function in the global scope, which is generally a good thing!
这篇关于app.controller VS在angular.js功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
