控制器
现在我们就用ng-controller指令来创建一个简单的控制器定义,如下所示:
<div ng-app="" ng-controller="MyController">
请输入一个名字:<input type="text" ng-model="person.name">
Hello <span ng-bind="person.name"></span>
</div>
<script>
function MyController($scope) {
$scope.person = {
name: "World"
};
}
</script>
如上所述,我们通过ng-controller指令创建了一个JavaScript对象 —— MyController并带有name属性,那参数$scope是什么呢,代表什么意思呢。
现在我们就来解答MyController对象参数 —— $scope。
$scope就是把一个DOM元素连结到控制器上的对象,它提供一个绑定到DOM元素(以及其子元素)上的执行上下文。它也是一个JavaScript对象,指向应用程序作用域内的所有HTML元素和执行上下文。作用域呢,就是作为$scope的数据属性关联到DOM上的,并且能在需要调试的时候被获取到。
要明确创建一个$scope对象,我们就要给DOM元素安上一个controller对象,使用的是ng-controller 指令属性。
所有$scope都遵循原型继承,这意味着它们都能访问父$scope们,对任何属性和方法,如果AngularJS在当前$scope上找不到,就会到父$scope上去找,如果在父$scope上也没找到,就会继续向上回溯,一直到$rootScope上,这个$rootScope是最顶级的$scope,它对应着含有 ng-app指令属性的那个DOM元素,也就是说根作用域关联的DOM就是ng-app指令定义的地方。
也就是说,拥有了$scope,我们就可以操作作用域内任何我们想要获取的对象数据。