javascript - angularjs 怎樣移除指令監(jiān)聽?
問題描述
angular移除指令內(nèi)容后,它的監(jiān)聽還在控制器的 $scope 上,要怎樣移除呢?代碼如下:
<!DOCTYPE html><html><head> <meta charset='utf-8'> <script src='http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js'></script></head><body><p ng-app='myApp' ng-controller='myCtrl'> <p id='content'><span-c insert='name'></span-c> </p> <button ng-click='del()'>刪除內(nèi)容</button> <button ng-click='info()'>查看作用域</button> 輸入內(nèi)容: <input ng-model='name'></p><script> var app = angular.module(’myApp’, []); app.controller(’myCtrl’, function ($scope, $compile) {$scope.name = 'John Doe';$scope.$watch('xxx',function(){ console.log('xxx');});$scope.del = function () { document.getElementById('content').innerHTML = '';}$scope.info = function () {// $scope.$$watchers = []; console.log($scope.$$watchers);} }); app.directive('spanC', spanC); // 指令 function spanC() {return { restrict: 'AE', template: ’’, scope:{insert:'=' }, link: function (scope, element, attrs) {scope.$watch('insert',function(n){ console.log('asd'); element[0].innerHTML = n;}); }} }</script></body></html>
如果我直接
$scope.$$watchers = [];
把控制器上的
$scope.$watch('xxx',function(){ console.log('xxx');});
也移除了,怎樣才能移除指令時(shí)連同它的監(jiān)聽也去掉呢?
問題解答
回答1:調(diào)用 $scope.$watch() 或 $scope.$on() 方法后,都會(huì)返回一個(gè)函數(shù)引用,用于移除監(jiān)聽。了解詳細(xì)信息,可以查看 Angular $rootScope 官方文檔。另外若想了解 $broadcast、$on、$emit 使用方法,可以參考 - angularjs的事件 $broadcast and $emit and $on 這篇文章。
$scope.del = function () { document.getElementById('content').innerHTML = ''; $scope.$broadcast(’destroySpan’);};// spanC 指令link函數(shù)link: function (scope, element, attrs) { var unwatch = scope.$watch('insert',function(n){ console.log('asd'); element[0].innerHTML = n; }); scope.$on(’destroySpan’, function() { unwatch(); });}回答2:
指令:
var clear = scope.$watch('insert',function(n){ console.log('asd'); element[0].innerHTML = n;});$scope.$on(’$destroy’, function() { clear();});
相關(guān)文章:
1. django - 后臺(tái)返回的json數(shù)據(jù)經(jīng)過Base64加密,獲取時(shí)用python如何解密~!2. css3 - 請(qǐng)問一下在移動(dòng)端CSS布局布局中通常需要用到哪些元素,屬性?3. 我在centos容器里安裝docker,也就是在容器里安裝容器,報(bào)錯(cuò)了?4. 我的html頁面一提交,網(wǎng)頁便顯示出了我的php代碼,求問是什么原因?5. tp6表單令牌6. angular.js - 如何通俗易懂的解釋“依賴注入”?7. docker 17.03 怎么配置 registry mirror ?8. node.js - node 客戶端socket一直報(bào)錯(cuò)Error: read ECONNRESET,用php的socket沒問題哈。。9. 老哥們求助啊10. 在MySQL中新增字段時(shí),報(bào)錯(cuò)??
