angularjs中的$scope参数

最新推荐文章于 2019-11-27 13:38:56 发布

dancheng_work

最新推荐文章于 2019-11-27 13:38:56 发布

阅读量1.5k

点赞数

分类专栏： # angularjs

本文链接：https://blog.csdn.net/dancheng1/article/details/78177909

版权

angularjs 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

scope是一个指向应用model的object，也是表达式的执行上下文。

scope被放置于一个类似应用的DOM结构的层次结构中。

angular是怎么知道变量发生了改变

1、能通过固定的接口才能改变变量的值，比如说只能通过set()设置变量的值，set被调用时比较一下就知道了。这种方法的缺点是写法繁琐。

2、脏检查，将原对象复制一份快照，在某个时间，比较现在对象与快照的值，如果不一样就表明发生变化，这个策略要保留两份变量，而且要遍历对象，比较每个属性，这样会有一定性能问题。

手动触发脏检查

$apply 仅仅只是进入angular context，然后通过$digest去触发脏检查

$apply 如果不给参数的话，会检查$scope里的所有监听的数据

$digest()所属的scope和其所有子scope的脏检查，脏检查又会触发$watch，整个Angular双向绑定机制就活了起来~

不建议直接调用$digest()，而应该使用$apple()，$apply其实不能吧信息直接送给$digest，之间还有$eval门卫把关，如果$apply带的表达式不合法，$eval会把错误送交$exceptionHandler，合法才出发digest，所有更安全。

$swtch方法：

实例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div ng-app>
        <div ng-controller="firstController">
            <input type="text" ng-model="name">
            改变次数：{{count}}---{{name}}
        </div>
    </div>
    <script type="text/javascript" src="../vendor/angular/angularjs.js"></script>
    <script type="text/javascript" src="./app/index.js"></script>
</body>
</html>

实现类：index.js

var firstController = function ($scope) {
    $scope.name = '张三';
    $scope.data = {
        name : '李四',
        count : 20
    }
    $scope.count = 0;
    //监听一个model  当一个model每次改变的时候都会触发这个函数
    $scope.$watch('name', function (newValue, oldValue) {
        $scope.count++;
        if($scope.count > 30){
            $scope.name = '大于30次了';
        }
    })
    //第三个参数为真表示，只要这个对象中有一个变化，就触发watch函数
    $scope.$watch('data', function (newValue, oldValue) {

    }, true)
}

效果图：

dancheng_work

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
angularjs中的$scope参数

scope是一个指向应用model的object，也是表达式的执行上下文。scope被放置于一个类似应用的DOM结构的层次结构中。angular是怎么知道变量发生了改变1、能通过固定的接口才能改变变量的值，比如说只能通过set()设置变量的值，set被调用时比较一下就知道了。这种方法的缺点是写法繁琐。2、脏检查，将原对象复制一份快照，在某个时间，比较现在对象与快照的值，如果
复制链接

扫一扫