Angular JS 中的内置方法之$watch
在$apply方法中存在脏检查,首先apply方法会触发evel方法,当evel方法解析成功后,会去触发digest方法,digest方法会触发watch方法。
$watch(watchFn,watchAction,deepWatch)
watchFn: angular表达式或函数的字符串
deepWatch:可选的布尔值 检查被监控的对象的每个属性是否发生变化
$watch会返回一个函数,想要注销这个watch可以使用函数
例如,实现一个当修改用户名超过五次就报警提示的功能
需要注意的是,$watch 仅仅作为一个监视器的存在,不能阻止你继续修改input内的值。
angular.module('MyApp',[])
.controller('ParserController',function($scope){
$scope.count = 0;
$scope.$watch('name',function(newVal,oldVal){
++$scope.count ;
if($scope.count > 5){
alert("hahaha")
}
});
});
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<script src="../../src/angular.js"></script>
<script src="parser.js"></script>
</head>
<body ng-app="MyApp">
<div ng-controller="ParserController">
<input ng-model="name">
</div>
</body>
</html>
如果监听的是一个对象,而不是一个普通的数值或字符串,那么需要将第三个参数设置为true,这时候才会完全对比前后两次修改的对象是否内容改变,而不是引用改变才触发监听事件。
Angular JS 中的内置方法之$watch的更多相关文章
- Angular JS 中的内置方法之表单验证
angular js 结合html5 可以实现强大的表单验证功能 关闭html5自带的表单验证功能可以用
- Angular JS 中的内置方法之filter
通过过滤器可以实现很多数据格式化的功能 常用方法形如{{ data | uppercase}} 或者是{{ 123.456 | number:2 }} 也可以通过在控制器中注入$filter来实现功能 ...
- js中数组内置方法
var arr = ['A','B','C','D']; length 计算数组的长度 arr.length//4 indexOf() 搜索一个指定的元素的位置 arr.indexOf('C');// ...
- js中的内置方法的兼容写法
1.如果浏览器不支持every属性,every的实现原理 if(Array.prototype.every===undefined){ Array.prototype.every=function(f ...
- JS中的内置对象简介与简单的属性方法
JS中的数组: 1.数组的概念: 数组是在内存中连续存储的多个有序元素的结构,元素的顺序称为下标,通过下标查找对应元素 2.数组的声明: ①通过字面量声明var arr1 = [,,,,] JS中同一 ...
- Angular JS 中的服务注册方法
在Angular JS中创建服务的几种方法 factory() service() constant() value() provider() factory(name,fn(){}) 该服务为单例的 ...
- Python中class内置方法__init__与__new__作用与区别探究
背景 最近尝试了解Django中ORM实现的原理,发现其用到了metaclass(元类)这一技术,进一步又涉及到Python class中有两个特殊内置方法__init__与__new__,决定先尝试 ...
- python中字符串内置方法
字符串类型 作用:定义姓名.性别等 定义方式: s='lzs' #\n换行 \t缩进4个空格 \r回退上一个打印结果,覆盖上一个打印结果 加上一个\让后面的\变得无意义 内置方法: (优先掌握) 1. ...
- js中的内置对象(还没怎么看)
在js里,一切皆为或者皆可以被用作对象.可通过new一个对象或者直接以字面量形式创建变量(如var i="aaa"),所有变量都有对象的性质.注意:通过字面量创建的对象在 ...
随机推荐
- Spring Boot2(四):使用Spring Boot多数据源实现读写分离
前言 实际业务场景中,不可能只有一个库,所以就有了分库分表,多数据源的出现.实现了读写分离,主库负责增改删,从库负责查询.这篇文章将实现Spring Boot如何实现多数据源,动态数据源切换,读写分离 ...
- MyBatis从入门到精通(三):MyBatis XML方式的基本用法之多表查询
最近在读刘增辉老师所著的<MyBatis从入门到精通>一书,很有收获,于是将自己学习的过程以博客形式输出,如有错误,欢迎指正,如帮助到你,不胜荣幸! 1. 多表查询 上篇博客中,我们示例的 ...
- NET中级开发工程师职责要求
NET中级开发工程师岗位职责1.熟练掌握 WebApi, ASP.NET MVC, Entity Framework,.NET CORE等技术,精通JQuery.Vue.Bootstrap等前端开发框 ...
- laravel配置不同环境的配置文件
//在入口bootstrap/App.php中 $env = $app->detectEnvironment( function () use ($app) { $uname = php_una ...
- .net core 杂记:WebAPI的XML请求和响应
一般情况下,restfult api 进行数据返回或模型绑定,默认json格式会比较常见和方便,当然偶尔也会需要以XML格式的要求 对于返回XML,普通常见的方式就是在每个aciton方法进行诸如X ...
- Java8新特性——lambda表达式.(案例:公司业务)
需求:现有一个员工姓名list,其中包含单字母索引.要求输出一个字符串,去掉所有单字母,所有名字首字母大写并用逗号隔开. package cn._2.thecompanyprocess; import ...
- MyBatis从入门到精通(四):MyBatis XML方式的基本用法之增删改
最近在读刘增辉老师所著的<MyBatis从入门到精通>一书,很有收获,于是将自己学习的过程以博客形式输出,如有错误,欢迎指正,如帮助到你,不胜荣幸! 1. insert用法 1.1 简单的 ...
- Solr 18 - 通过SolrJ局部更新Solr中的文档 (原子操作、非覆盖操作)
目录 1 需求分析 2 需求实现 2.1 pom.xml依赖 2.2 Java代码示例 3 补充说明 3.1 关于文档中_version_的取值说明 3.2 store=true/false的区别 1 ...
- Codeblocks 批量注释与对齐快捷键的教学方法
Ctrl+Shift+C 批量注释 Ctrl+shift+X 批量取消注释 Click Settings->Editor->KeyboardShortcuts (in the left o ...
- 21 | 移动测试神器:带你玩转Appium