angularJS的$watch和$apply
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body ng-app="fng">
<div ng-controller="fc1">
<div ng-bind="timeNow"></div>
<div ng-bind="timeNow2"></div>
<hr>
<div ng-bind="test.count"></div>
<div ng-bind="test.name"></div>
<input type="button" value="增加" ng-click="add()"/>
</div>
</body>
<script src="angular.js"></script>
<script>
var ngApp=angular.module("fng",[]);
ngApp.controller("fc1",['$scope','$http',function($scope){
$scope.timeNow=new Date(); setInterval(function(){
//从一个宏观的角度来看$scope.$apply要比$scope.$watch的范围大得多
/*
* $scope.$apply方法内部给出要更新的$scope局部成员,
* 这样才能触发ng的局部更新监听
* (如果使用$digest的话那么整个$scope中的成员变化都会被监听,效率大大降低)
* */
$scope.$apply(function() {
if (true) {
$scope.timeNow = new Date();
$scope.timeNow2 = new Date();
}
});
});
//=====================================================
$scope.test={
count:0,
name:"小于10"
};
$scope.add=function(){
$scope.test.count+=1;
};
//这是针对于你想跟踪一个你自己的成员而设计
/*
* $scope.$watch提供三个参数(对象成员/其他成员, 回调函数, (可选)*对象成员的属性*是否有变化)
* 第三个参数如果不填,只有该对象变为数组或者其它类型才能触发回调函数
* */
$scope.$watch('test',function(){
if($scope.test.count>10){
$scope.test.name="大于10啦!";
}
},true);
}]);
</script>
</html>
angularJS的$watch和$apply的更多相关文章
- AngularJs $scope 里面的$apply 方法和$watch方法
Angular $scope 里面的$apply 方法 Scope提供$apply方法传播Model变化 <!DOCTYPE html> <html> <head> ...
- angularJS $watch $apply $digest
看O'Reilly的书看到$watch这部分,不过没看懂,网上很多资料也含糊不清,不过还是找到了几个好的,简单记录一下. 一句话说明,$watch是用来监视变量的,好了直接上代码 <html&g ...
- angularJS报错$apply already in progress的原因和解决方法
如果我们使用了AngularJS中的$scope.$apply()或者$scope.$digest(),我们很可能会遇到类似下面的错误,虽然这个错误没有太大影响,但是在日志中看起来还是很不爽的,日志中 ...
- Angularjs的$apply及其优化使用
今天,我们要聊得是Angularjs中的小明星$apply.当我们数据更新了,但是view层却没反应时,总能听到有人说,用apply吧,然后,懵懂无知的我们,在赋值代码后面加了$scope.$appl ...
- jQuery和AngularJS的区别小分析
最近一直在研究angularjs,最大的感受就是它和之前的jQuery以及基于jQuery的各种库设计理念完全不同,如果不能认识到这点而对于之前做jQuery开发的程序员,去直接学习angularjs ...
- angularJS和jQuery的区别
问题: 假如我熟悉利用jQuery去开发客户端应用,那么我怎么上手angularjs,能否描述下所需要的模式转变,下面这些问题能够帮助你给出一个回答: 1.在设计客户端web应用的时候有什么区别,最大 ...
- 关于angularjS与jQuery框架的那些事
这篇文章主要介绍了jQuery和angularJS的区别浅析,本文着重讲解一个熟悉jQuery的程序员如何应对angularJS中的一些编程思想的转变吗,需要的朋友可以参考下 最近一直研究angula ...
- AngularJs 与Jquery的对比分析,超详细!
闲来无事,在网上发现了一篇对比AngularJs和Jquery的文章.恰好最近自己也在研究AngularJs.特此收藏.需要的朋友可以参考. 原问题:假如我熟悉利用jQuery去开发客户端应用,那么我 ...
- AngularJs 脏值检查及其相关
今天突然就想写写$digest和$apply,这些都是脏值检查的主体内容. 先以普通js来做一个简单的监控例子吧: var div = ducoment.getElementById("my ...
随机推荐
- Revit二次开发示例:ErrorHandling
本示例介绍了Revit的错误处理. #region Namespaces using System; using System.Collections.Generic; using Autodes ...
- 新旧各版本的MySQL可以从这里下载
http://downloads.mysql.com/archives/
- jquery easyui datagrid 分页详解
由于项目原因,用了jquery easyui 感觉界面不错,皮肤样式少点,可是官网最近打不开了,资料比较少,给的demo没有想要的效果,今天在用datagrid 做分页显示的时候,折腾了半天,网上的资 ...
- .NET生成静态页面的方案总结
转载自:http://www.cnblogs.com/cuihongyu3503319/archive/2012/12/06/2804233.html 方法一:在服务器上指定aspx网页,生成html ...
- WPF的Page介绍及Page Window Frame 之间的链接使用示例,嵌套问题
本文源参考 http://www.cnblogs.com/ListenFly/archive/2013/02/24/2923474.html 谢谢源作者 WPF中的Page相比Window来说更加的精 ...
- Apache和mysql的安装设置
Apache和mysql的安装较简单,主要是安装前请保证80端口未被占用 比如 iis 以前安装过的apache mysql 先停止运行phpmyadmin,主要是配置文件的问题,把phpMyAdmi ...
- SQLHelper 简介
什么是SQLHelper SqlHelper是一个基于.NETFramework的数据库操作组件.组件中包含数据库操作方法,目前SqlHelper有很多版本,主要以微软一开始发布的SqlHelper类 ...
- c3p0配置 initialPoolSize 和minPoolSize 可以设为0吗?设0有坏处吗?
c3p0配置 initialPoolSize 和minPoolSize 可以设为0吗?设0有坏处吗? c3p0配置 initialPoolSize 和minPoolSize 可以设为0吗?设0有坏处吗 ...
- 分布式缓存(Cache)
1. 单层分布式cache. 如memcache. 2. 多层分布式cache. 服务端和调用者本地都存放cache, 使用udp组播解决cache同步更新问题,但不可靠. 3. 改进的多层分布式ca ...
- DS实验题 击鼓传花
题目: 代码1(数组实现): // // main.cpp // DS-击鼓传花 // // Created by wasdns on 16/11/9. // Copyright © 2016年 wa ...