你是否需要在$ scope $ destroy事件中取消绑定$ scope.$ on?

jcu*_*bic 10 javascript angularjs

我有使用$ on绑定事件的指令我是否需要在范围被销毁时删除该绑定,还是自动完成?我还需要调用$ element.off吗?

return {
    restrict: 'A',
    link: function($scope, $element, $attrs) {
        $element.on('load', function() {
            $element[0].contentWindow.focus();
        });
        $scope.$on('iframe:focus', function() {
            $element[0].contentWindow.focus();
        });
    }
};
Run Code Online (Sandbox Code Playgroud)

lin*_*lin 12

$scope.$on() 由于视图中的E2E绑定,当侦听器丢失其表示时,将自动销毁/清除它们.请注意,$rootScope.$on()绑定不会发生这种情况.您还可以查看AngularJS$ scope文档.

用几句话回答:

  • $scope.$on(); 将被自动销毁.
  • 你需要$rootScope.$on()手动销毁.

该文件说:

范围销毁 - 当不再需要子范围时,子范围创建者有责任通过范围销毁它们.$ destroy()API.这样做是为了阻止$ digest调用传播到子作用域,并允许垃圾收集器回收子作用域模型使用的内存.

如何销毁的示例$rootScope.$on():

//bind event
var registerScope = $rootScope.$on('someEvent', function(event) {
    console.log("fired");
});

// clean up
$scope.$on('$destroy', registerScope);
Run Code Online (Sandbox Code Playgroud)

这个plnkr将向您展示$scope.$on()和 的不同行为$rootScope.$on().

通过切换此plunkr中的视图,控制器将被重新绑定到您的视图.该$rootScope.$on();事件被绑定每次切换视图时不破坏前视图的事件绑定.以这种方式,$rootScope.$on()听众将被堆叠/倍增.$scope.$on()绑定不会发生这种情况,因为它会通过切换视图而被破坏(在DOM中丢失E2E绑定表示).


注意:

  • $scope.$on('event');会听听$scope.$broadcast('event')&$rootScope.$broadcast('event')

  • $rootScope.$on('event'); 只会听 $rootScope.$broadcast('event')