1.什么是scopes
官网上给出了两句话
an object that refers to the application model. 应用程序的模型对象
an execution context for expressions. 为 表达式提供执行上下文
其实简单理解就是，数据对象存储区域
scope的作用：
watch expressions 监控表达式
propagate events 传播事件
2.scope特性
1.提供API $watch 去观察模型的变化
2.提供API $apply 将angular领域中的model的变化传播到view中去
scope定义了不同的应用组件对共享模型的访问权限，子scope可以继承父scope的属性，独立的scope则是独立的存在
scope为表达式提供上下文
比如{{who}}就是没有任何的意义，但是一旦在scope中定义了who这个属性，那么这个表达式将具有自己的价值
3.Scope 作为 数据-模型
这时候，scope是controller和view之间的联系 这就组成了一个典型的 mvc 模式
这个时候 如果你在controller中定义了 $watch 的表达式，
那么这时候每当所监控的scope改变的时候，能够执行你需要执行的相关操作，并且它也会去更新dom里面所对应的值
angular.module('Example', [])
.controller('MyController', ['$scope', function($scope) {
$scope.username = 'World';
$scope.sayHello = function() {
$scope.greeting = 'Hello ' + $scope.username + '!';
};
$scope.$watch('username',function(){
console.log("username change:"+ $scope.username)
})
$scope.$watch('greeting',function(){
console.log("greeting change:"+ $scope.greeting)
})
}]);<body ng-app="Example">
<div ng-controller="MyController">
Your name:
<input type="text" ng-model="username">
<button ng-click='sayHello()'>greet</button>
<hr>
{{greeting}}
</div>
</body>使用上述的代码，可以了解 model的绑定大致过程
首先加载过程
username change:a
点击greet按钮的输出，
greeting change:Hello a!
首先运行到controller的js文件的的时候
首先会为当前的子controller定义一个子的scope
然后会去在template区域区域中检索出scope绑定的dom节点
然后会去 定义 username和 sayHello这两个模型对象 至于greetring 很明显这时候已经呗定义为 undefined对象
这时候由于数据对象内容发生了改变那么
触发apply传递出当前对象改变的事实，去改变scope所对应的dom节点事件，比如改变但前的text，以及表达式等等
扫一扫
480
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
