标签：angular angularjs ng-bind ng-controller
AngularJS中有ng-controller，通过这样可以给DOM元素装上控制器。
比如这样：
<div ng-controller="firstController"> <p ng-bind="i"></p> <input type="text" ng-model="abc" value=""> <p ng-bind="abc"></p> </div>
这样就代表控制器的作用域是整个div，里面的内容受到名为firstController的控制器控制。这段代码中，
<p ng-bind="i"></p>
相当于{{i}}，但是i这个变量还没定义呢。于是要在控制器中定义：
<script type="text/javascript">
var firstController = function($scope){
$scope.i = 0;
}
</script>firstController看成一个函数，$scope是其作用域，注意$scope不能改成别的变量名，这是专用的。
<input type="text" ng-model="abc" value="">
其实相当于在 firstController函数中自动加了个变量abc。
上面只是AngularJS 1.2.x 版本的用法，在高版本中，禁止了这种方式，因为这种方式会让controller满天飞，分不清层次，所有东西都挂在$rootScope上。
高版本中的用法为：
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8">
</head>
<body>
<div ng-controller="firstController">
<p ng-bind="i"></p>
<input type="text" ng-model="abc" value="">
<p ng-bind="abc"></p>
</div>
<script src="http://cdn.bootcss.com/angular.js/1.4.0-rc.2/angular.min.js"></script>
/**
* Module
*
* Description
*/
angular.module(‘app‘, []).controller(‘firstController‘,
function($scope) {
$scope.i = 0;
});
</script>
</body>
</html>本文出自 “柚汁前端” 博客，请务必保留此出处http://iampomelo.blog.51cto.com/10193513/1658455
标签：angular angularjs ng-bind ng-controller
原文地址：http://iampomelo.blog.51cto.com/10193513/1658455
