當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
深究AngularJS——监听模型$watch
生活随笔
收集整理的這篇文章主要介紹了
深究AngularJS——监听模型$watch
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
前言
1.$watch是scope內置的函數，它的作用是用來監聽數據的變化。
2.$watch可監聽哪些數據？
單個對象的屬性
需要計算的結果（函數）
3. 語法: $scope.$watch(F,M,B);
對$watch參數的了解
F：
要監聽的數據（表達式或函數的字符串），主要是監聽這些數據改變沒有。它會返回被監聽數據的當前值。
M：
當監聽的數據發生變化時，就會調用M（它是函數或表達式）。如果是函數形多，則會接收到F的新舊兩個值和作用域對象，示例：
$scope.$watch("formData",function(newValue,oldValue, scope) {//這里是監聽的數據發生變化后調用//formData是$scope.formData={};里的}}, true);B：
為true時：將會檢查監聽對象的每個屬性是否發生變化。適用于監聽數組或者監聽的是一個對象上的所有屬性。由于每次都要遍歷監聽對象的值是否發生變化，如果數組值過多，或對象屬性多，那么一點點改變就會造成大量的遍歷。
監聽一個函數的寫法
<body><div ng-app="myApp" ng-controller="control"><input type="text" set-Focus ng-blur="setBlur()"><button ng-click="getFocus()">獲取焦點</button></div> <script type="text/javascript"> //模型var app = angular.module('myApp',[]);//控制器app.controller("control",function($scope){$scope.isFocus = false;//監聽的函數，須返回當前值$scope.method = function(){return $scope.isFocus;}//點擊獲得焦點操作$scope.getFocus = function(){$scope.isFocus = true;$scope.method();};//失去點后，賦值為false可再次點擊獲得焦點$scope.setBlur = function(){$scope.isFocus = false;}});//自定義指令app.directive('setFocus',[ function(){return {link:function(scope, element){ //監聽的數據是一個函數，該函數必須先在父作用域定義scope.$watch(scope.method,function(newValue,oldValue, scope) {if(newValue&& !oldValue){element[0].focus(); //獲取焦點 }}, true);;}};}]);</script> </body>監聽多個數據的寫法
兩種：
1.用+連接起來：$scope.$watch('obj.name+obj.age');
2.放進一個數組或對象中后，將第三個參數設為true，如:$scope.$watch('obj',function(){},true);
使用watch的注意事項
總結
以上是生活随笔為你收集整理的深究AngularJS——监听模型$watch的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 面向对象（下）知识点
- 下一篇： 深究AngularJS——下拉框（sel