angularjs中 $watch 和$on 2种监听的区别?
生活随笔
收集整理的這篇文章主要介紹了
angularjs中 $watch 和$on 2种监听的区别?
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1.$watch簡單使用
$watch是一個scope函數,用于監聽模型變化,當你的模型部分發生變化時它會通知你。
?
$watch(watchExpression, listener, objectEquality);
每個參數的說明如下:
watchExpression:監聽的對象,它可以是一個angular表達式如'name',或函數如function(){return $scope.name}。
listener:當watchExpression變化時會被調用的函數或者表達式,它接收3個參數:newValue(新值), oldValue(舊值), scope(作用域的引用)
objectEquality:是否深度監聽,如果設置為true,它告訴Angular檢查所監控的對象中每一個屬性的變化.?如果你希望監控數組的個別元素或者對象的屬性而不是一個普通的值,?那么你應該使用它
?
$watch可以監聽多個模型的變化
<body ng-app="app" ng-controller="first"><button ng-click="name='a'">1</button><button ng-click="name='b'">2</button><button ng-click="name='c'">3</button><button ng-click="type=2">4</button><button ng-click="type=3">5</button><p>{{name}}</p></body><script type="text/javascript">var app = angular.module("app", []);app.controller("first", function($scope) {$scope.name = 'q';$scope.type = 1;function te() {console.log($scope.name " " $scope.type);}$scope.$watch('name type', function(newValue, oldValue) { //2個參數為 一個為新值,一個為舊值te();});})</script>
2.$on的用法
$on是一個scope函數,用于監聽事件的變化,當你的事件發生時它會通知你。
module.controller('freefedCtrl',['$scope',function($scope){//監聽directiveClick事件$scope.$on('directiveClick',function(event,param){console.log( param ); // 打印結果 {title : '我是來自指令子級作用域'}});$scope.change = function(title){var result = '請注意接收父級廣播';//向子級作用域廣播parentBroadcast事件$scope.$broadcast('parentBroadcast',{msg : result});};}]);
更多專業前端知識,請上 【猿2048】www.mk2048.com
總結
以上是生活随笔為你收集整理的angularjs中 $watch 和$on 2种监听的区别?的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 跨域方式
- 下一篇: js中split()和join()的用法