没时间解释了,快上车!Angular入门第三讲:$apply()的使用

引言

    angular js的双向数据绑定,在开发中起到的作用灰常大,但是,并不是所有时候都能起作用。

    找了下资料发现,双向数据绑定其实也就是当模型发生了变化的时候,
    重绘了DOM,使你看到数据被更新了,引发模型变化的情况有: 
    1.dom事件;

    2.响应触发回调;

    3.浏览器的地址变化;

    4.计时器触发回调;
    以上的某一个情况发生,都会触发模型监控机制,同时调用了$apply方法,重绘了dom;
    通常情况下,我们使用的一些指令或服务,
    如$http,$timeout,$location等都会调用$apply方法,
    从而使用dom被重绘,数据得到更新,实现了双向数据绑定。
    而在有些情况下,比如回调里,
    回调函数里执行的方法被不会触发$apply方法。假如当你点击打了比较input select radio等等,
    触发了模型监控,值也随之更新了。
    此时需要手动调$scope方法,使dom重绘。

实例代码:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/angular.min.js"></script>
</head>
<body>
<div ng-controller="myCtrl">
    展示数据:<span ng-bind="name"></span>
</div>
<script>
    var app = angular.module("myApp", []);
    app.controller("myCtrl", function($scope) {
        $scope.name = "tom";// 初始化数据
        setTimeout(function() {// 延迟赋值
            $scope.name = "jerry";
            console.log("*****************");
        }, 1000);

        $scope.$watch("name", function(nv, ov) {
            console.log("$watches:", nv, ov);
        },true);
    });
</script>
</body>
</html>

$watch方法监听module变化

    当你的数据模型中某一部分发生变化时,$watch 函数可以向你发出通知。你可以监控单个对象的属性,也可以。

    监控需要经过计算的结果(函数),实际上只要能够被当作属性访问到,或者可以当作一个JavaScript 函数被计算。 

小结

    $watch这个函数在项目中会经常用到,所以我们需要对这个函数灵活的掌握,
     这样我们在自定控件或者完成一些比较复杂的需求的时候很更加的方便。
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值