angularJS1笔记-(2)-$watch方法监听变量的变化
html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
<input type="text" ng-model="name">{{name}}
</div>
</div>
<script type="text/javascript" src="../../vendor/angular/angularJs.js"></script>
<script type="text/javascript" src="app/index.js"></script>
</body>
</html>
js:
angular.module('myApp',[]).controller('firstController',function ($scope) {
$scope.name = "dyk";
$scope.count = 2;
$scope.data = {
name:'李四',
count:20
}
//观察name 当一个model值发生改变的时候 都会触发第二个函数
$scope.$watch('name',function (newValue, oldValue) {
$scope.count++;
if($scope.count>30){
$scope.name = '已经大于30次了';
}
});
$scope.$watch('data',function () {
//指定第三个参数为true 意思是说如果触发了data对象里的任何一个值就可以触发监听
},true);
});
最终结果:


angularJS1笔记-(2)-$watch方法监听变量的变化的更多相关文章
- React和Vue中,是如何监听变量变化的
React 中事件监听 本地调试React代码的方法 先将React代码下载到本地,进入项目文件夹后yarn build 利用create-react-app创建一个自己的项目 把react源码和自己 ...
- javascript 原生方法监听DOM结构改变事件
js原生方法监听DOM结构改变事件 document.addEventListener('DOMNodeInserted',function(){alert(1)},false);document.a ...
- onchange监听input值变化及input隐藏后change事件不触发的原因与解决方法(设置readonly后onchange不起作用的解决方案)
转自:https://www.cnblogs.com/white0710/p/7338456.html 1. onchange事件监听input值变化的使用方法: <input id=" ...
- android -- 小问题 关于ListView设置了OnScrollListener之后onScrollStateChanged()和onScroll方法监听不到的问题
关于ListView设置了OnScrollListener之后onScrollStateChanged()和onScroll方法监听不到的问题: 原因: 首先OnScrollListener是焦点滚动 ...
- 每天一点点之vue框架 watch监听变量(深度监听)
<div> <p>FullName: {{fullName}}</p> <p>FirstName: <input type="text& ...
- es6的set和get实现数据双向绑定,监听变量变化。
直接上代码吧,这个用法真的是效仿了.net的枚举. vue的数据双向绑定就是用这个实现的. 代码: html: <input type="text" id="inp ...
- 详解vuex结合localstorage动态监听storage的变化
这篇文章主要介绍了详解vuex结合localstorage动态监听storage的变化,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 需求:不同组件间共用同一数据,当一个 ...
- JS 获取和监听屏幕方向变化(portrait / landscape)
移动设备的屏幕有两个方向: landscape(横屏)和portrait(竖屏),在某些情况下需要获取设备的屏幕方向和监听屏幕方向的变化,因此可以使用Javascript提供的 MediaQueryL ...
- 监听EditText的变化
http://liangruijun.blog.51cto.com/3061169/729505 之前博客上的有关EditText的文章,只是介绍EditText的一些最基本的用法,这次来深入学习一下 ...
随机推荐
- maven第一天——入门与基本概念
一.什么是maven? 1.概述 核心点:项目构建.依赖管理.[更新]:源码关联 (如何关联源码:在依赖的jar上右击 maven download source即可) Maven是一个项目管理和综合 ...
- [Oracle]如何查看一个数据文件是否是自动扩展
开始 SQL> col file_id format 99SQL> col file_name format a50SQL> col tablespace_name format a ...
- python基础学习1-正则表达式
#!/usr/bin/env python # -*- coding:utf-8 -*- import re print(re.findall('alex','yyyyabbblalexrrreooo ...
- 【转载】malloc内存分配与free内存释放的原理
原文:http://www.cnblogs.com/huhuuu/p/3456662.html 前段时间一直想看malloc的原理,在搜了好几篇malloc源码后遂放弃,晦涩难懂. 后来室友买了本深入 ...
- 03、 forms组件
1.校验字段功能 1.reg页面准备 models from django.db import models class UserInfo(models.Model): useranme = mode ...
- 11 基于django的图书管理系统 多表
1.需求 作业需求:1.列出图书列表.出版社列表.作者列表2.点击作者,会列出其出版的图书列表3.点击出版社,会列出旗下图书列表4.可以创建.修改.删除 图书.作者.出版社 踩分点:1.满足需求1,2 ...
- guacamole实现RDP的下载
1. 配置说明 1.1 主要特别配置以下三项 enable-drive 默认情况下禁用文件传输,但启用文件传输后,RDP用户可以将文件传输到持久存在于Guacamole服务器上的虚拟驱动器.通过将此参 ...
- 关于Mybatis的Example(and ,or )应用
近期的一个项目中遇到Mybatis的Example的and or 的应用,感觉有必要记录一下(个人见解,有问题请指出.谢谢) 1.在Example中的每一个Criteria相当于一个括号,把里面的内容 ...
- bintray 在android3.2上传遇到的问题
1.报错信息如下: Gradle DSL method not found: 'google()'Possible causes: The project 'JustTest' may be usin ...
- hdu1754 I Hate It(线段树单点更新,区间查询)
传送门 有更新单个学生成绩和查询某个区间内学生成绩最大值两种操作 线段树代码 #include<bits/stdc++.h> using namespace std; +; using n ...