Angular 事件监听$scope.$watch

朴灿烈づ我的快乐病毒、 2021-07-25 02:43 677阅读 0赞

监听服务$watch
    	1、不需要在控制器脚本中注入,直接使用
    	2、监听任何想要监听的NG变量的值,并在这个值改变的时候调用回调函数
    
    	语法:$scope.$watch('想要监听的NG变量(不需要加$scope.)或字符串',回调函数)
    	3、开启深度监视,如监视数组内容的添加等,不开启深度监视不会调用回调函数
    			$scope.$watch('想要监听的NG变量(不需要加$scope.)或字符串',回调函数,true)

代码示例:

<html ng-app='app' ng-controller='main' >
    <head>
    	<meta charset="utf-8">
    	<meta name='viewport' content='width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0'>
    	<title ng-bind='mainTitle'></title>
    
    	<script src='js/angular.js'></script>
    	<script src='js/angular.route.min.js'></script>	
    	<style>
    
    	</style>
    </head>
    <body >
    
    <input type="text" ng-model='in'>
    
    <div ng-controller='d1'>
    	<input type="text" >
    	<button ng-click='check()'>点击</button>
    	<p>{ { arr}}</p>
    </div>
    
    <script>
    	var app=new angular.module('app',[]);
    
    
    	app.controller('main',['$scope',function($scope){ 
    			$scope.in='';
    			$scope.$watch('in',function(){ console.log('他变了')});
    
    	}])
    	//深度监视
    	app.controller('d1',['$scope',function($scope){ 
    	
    	$scope.arr=[1,2,3];
    	$scope.$watch('arr',function(){ 
    		console.log('变了')
    	},true)
    
    	$scope.check=function()
    	{ 
    		this.arr.push(1);
    	}
    
    }])
    </script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，677人围观）

还没有评论，来说两句吧...

相关阅读

相关 Angular7实现监听组件外部的点击事件（实用）

原文出处：[https://www.jianshu.com/p/2c5a834b30c2][https_www.jianshu.com_p_2c5a834b30c2] (建议

矫情吗；*/ 2023年06月16日 12:54/ 0 赞/ 4 阅读

相关 angular监听input事件_angular 监听input单选，多选值的变化

\{ \{item.name\}\}(\{ \{item.cnt\}\}) 页面效果是这样： ![Image 1][] ts的代码是这样的： getCheckList(

迷南。/ 2023年01月08日 15:25/ 0 赞/ 179 阅读

相关事件监听机制（五）再话Jdk事件监听到Spring框架事件监听

事件监听机制（五）再话Jdk事件监听到Spring框架事件监听背景熟悉`Spring` 框架的同学都清楚，`Spring`容器启动到销毁事件监听机制始终贯穿，那

r囧r小猫/ 2022年09月06日 00:13/ 0 赞/ 305 阅读

相关事件监听机制

![这里写图片描述][20160420164724788] 　　Java中的事件监听是整个Java消息传递的基础和关键。牵涉到三类对象：事件源（Event S

桃扇骨/ 2022年07月16日 12:24/ 0 赞/ 325 阅读

相关 angular监听鼠标,键盘事件

关键词:$event 监听鼠标事件 <button (click)="onClick($event)"></button> $event 输出: Mous

以你之姓@/ 2022年05月20日 06:44/ 0 赞/ 696 阅读

相关 redis事件监听

redis自2.8.0之后版本提供[Keyspace Notifications][]功能，允许客户订阅Pub / Sub频道，以便以某种方式接收影响Redis数据集的事件。

我不是女神ヾ/ 2022年04月05日 11:32/ 0 赞/ 492 阅读

相关事件监听机制（四）从Java事件监听到Spring事件监听

事件监听机制（四）从Java事件监听到Spring事件监听 java 事件监听 1. 发布订阅模式 `java.util.Observable`发布者

ゝ一纸荒年。/ 2022年03月25日 10:26/ 0 赞/ 446 阅读

相关事件监听机制（一）Java事件监听

事件监听机制（一）Java事件监听事件监听实现流程 1. 事件对象：继承自`java.util.EventObject`对象，由开发者自行定义实现

小灰灰/ 2022年03月17日 15:25/ 0 赞/ 523 阅读

相关事件监听机制（二）Spring事件监听

事件监听机制（二）Spring事件监听事件监听实现流程 1. 事件对象：继承自`java.util.EventObject`对象，由开发者自行定义

小鱼儿/ 2022年03月15日 05:44/ 0 赞/ 443 阅读

相关 Angular 事件监听$scope.$watch

监听服务$watch 1、不需要在控制器脚本中注入,直接使用 2、监听任何想要监听的NG变量的值,并在这个值改变的时候调用回调函数

朴灿烈づ我的快乐病毒、/ 2021年07月25日 02:43/ 0 赞/ 678 阅读