AngularJS中$watch
$watch在digest执行时,如果watch观察的value与上一次执行时不一样时,就会被触发。
angularjs内部的watch实现了页面随model的及时更新。
$watch 方法在用的时候主要是手动监听一个对象,但对象发生变化时触发某个对象。
语法:$watch(watchFn,watchAction,deepWatch);
$scope.data = {
name:"李四",
count: 20
};
此时data里的name和count都要监听,那么可以这么写:
$scope.$watch('data',function(){
//code code
},true)
如果不加第三个参数,那么只会监听data,所以当data引用改变时才会触发。
因此当需要监听一些引用对象时需要设置第三个参数为true。
angularjs:
app.controller("firstController",["$scope", function ($scope) {
$scope.name = "张三";
$scope.count = 0;
//监听一个 model 当一个 model 每次改变时 都会触发第二个函数
$scope.$watch("name",function (newValue, oldValue) {
++$scope.count;
if($scope.count > 3){
$scope.name = '已经大于3次了';
}
});
}]);
html:
<div ng-controller="firstController">
<input type="text" value="" ng-model="name"/>
改变次数:{{count}}-{{name}}
</div>
AngularJS中$watch的更多相关文章
- 两强相争,鹿死谁手 — JQuery中的Ajax与AngularJS中的$http
一.JQuery与AngularJS 首先,先简单的了解一下JQuery与AngularJS.从源头上来说,两者都属于原生JS所封装成的库,两种为平行关系. 二.Ajax请求与数据遍历打印 这里是Aj ...
- bootstrap tooltips在 angularJS中的使用
使用bootstrap自带的提示控件,省去了不少事情 <div class="s2" ng-init="InitTooltip()"> <in ...
- angularJS实践过程中出现的问题总结
同名服务 在一次项目里,之前是同事写的.我有一次在异步获取服务器上的数据时,习惯把api地址写在一个服务Store里,但是程序总是返回Store.api.get()里的get is undefined ...
- ANGULARJS 动态编译添加到dom中
在使用angularjs 时,希望通过动态构建angular模版,再通过angular进行展示. 使用 方法如下: <html ng-app="app"> <he ...
- AngularJS进阶(十二)AngularJS常用知识汇总(不断更新中....)
AngularJS常用知识汇总(不断更新中....) 注:请点击此处进行充电! app.controller('editCtrl',['$http','$location','$rootScope', ...
- 使用AngularJS开发中的几个问题
1.AngularJS的模板绑定机制好像和其$http服务也有一定关系,如果用jQuery Ajax的返回值赋给$scope的作用域变量,整个绑定显示的节奏慢一个事件,神器果然麻烦啊. 2.对hidd ...
- 【问题:发现与解决】angularJs指令在dijit控件中的使用
由于公司主要用的JS框架是DOJO,最近又运用了angularJs.因此,不可能避免的遇到dojo控件和angular指令(directive)共用时遇到的一些问题,问题如下: <input ...
- angularJs 模拟jQuery中的this
在angularJs中,this指向$scope!可以$event配合使用$(event.target)实现,代码如下: HTML部分: <p ng-click="testClick( ...
- 实例解说AngularJS在自动化测试中的应用
一.什么是AngularJS ? 1.AngularJS是一组用来开发web页面的框架.模板以及数据绑定和丰富UI的组件: 2.AngularJS提供了一系列健壮的功能,以及将代码隔离成模块的方法: ...
随机推荐
- Spring学习(二)-----eclipse新建spring项目
一:准本工作(下载需要的jar包) 1.下载准备Spring-framework-4.2.0 链接为: http://repo.springsource.org/libs-release-local/ ...
- oracle的分号和斜杠/
;是执行语句必须的/是执行语句块必须的 比如执行一个触发器 CREATE OR REPLACE TRIGGER "TRG_1" BEFORE INSERT ON "CAT ...
- HDU-4055:Number String
链接:HDU-4055:Number String 题意:给你一个字符串s,s[i] = 'D'表示排列中a[i] > a[i+1],s[i] = 'I'表示排列中a[i] < a[i+1 ...
- 论文笔记:Visualizing and Understanding Convolutional Networks
2014 ECCV 纽约大学 Matthew D. Zeiler, Rob Fergus 简单介绍(What) 提出了一种可视化的技巧,能够看到CNN中间层的特征功能和分类操作. 通过对这些可视化信息 ...
- 点滴拾遗 - 自定义 Format 控制 String.Format 行为
点击下载示例代码 String.Format 一重载方法的签名如下 public static string Format( IFormatProvider provider, string form ...
- python中 try、except、finally 的执行顺序
def test1(): try: print('to do stuff') raise Exception('hehe') print('to return in try') return ...
- OA_1界面
<%@ page language="java" contentType="text/html;charset=GB18030" pageEncoding ...
- unrecognized selector send to instancd 快速定位
1.在Debug菜单中Breakpoints->Create Symbolic Breakpoint; 2.在Symbolic中填写方法签名: -[NSObject(NSObject) does ...
- 引用百度bcebos jar 503问题
最近使用jeecms管理公司各个站点,关于附件部分采用bos进行上传处理. 在引用bosjar的时候,出现503问题,打断点打印异常堆栈信息,也获取不到.后来使用watch,发现BosClientCo ...
- lintcode-408-二进制求和
408-二进制求和 给定两个二进制字符串,返回他们的和(用二进制表示). 样例 a = 11 b = 1 返回 100 标签 二进制 字符串处理 脸书 思路 先相加,在处理进位,为了方便操作,将选字符 ...