zoukankan      html  css  js  c++  java
  • angularjs之事件绑定、解除事件绑定

    今天在开发时,遇到一个坑,花了一下午时间也没找到原因,无奈小菜鸟只能寻求公司里大牛的帮助,果然,大牛就是大牛,对比了几个输出结果,就看出问题所在。所以小菜鸟当然不会错过这个分享的时机啦~废话不多说进入正题:

    在angular开发时,会把整体分解成各个功能块,然后使用自定义指令directive或者service或者factory,总之想尽办法再给组合在一起,所以问题来了~

    比如:往一个页面添加元素(按钮?等等),此时点击添加的按钮在directive1里,而元素的添加又在directive2里,所以要怎么通讯呢,我选择了事件的方式:

    directive1  有代码如下:

    $scope.insertWidget = function(type){
      $rootScope.$emit("widget.insert",type);
    };

    directive2 有代码如下:

    $rootScope.$on("widget.insert",function($event,type){
      //功能代码
    });

    当然这是有问题的。

    当directive2里的scope被destroy的时候,它绑定的事件并没有解除,因为绑定在$rootScope下了,所以当我再次操作时,事件会累加,导致再次刷新该页面的时候,widget.insert事件累积了两次,(以此累积)。

    在我今天要完成的功能里就造成了影响,因为我是每添加一个元素会有$modal.open的操作,所以这样我去关闭这个modal会累积关闭几个,如果不解除的话。

    所以解决方法是:

      $on事件会返回一个函数,只要在当前scope被destroy时,执行这个函数就好了~见代码:

        var destroyInsert = $rootScope.$on("widget.insert",function($event,type){
          //功能代码
        });

        $scope.$on("$destroy",function(){
          destroyInsert();
        });

    今天遇到的这个坑就解决啦~

  • 相关阅读:
    ui、li模拟下拉框
    六项精进
    Echarts柱状图添加点击事件
    [UWP]爱恋动漫BT开发小记
    [杂谈]这个四月
    [uwp]自定义图形裁切控件
    [uwp]自定义Behavior之随意拖动
    [uwp]数据绑定再学习
    [mvc]记一次“项目”的历程
    [uwp]ImageSource和byte[]相互转换
  • 原文地址:https://www.cnblogs.com/sheting/p/5071096.html
Copyright © 2011-2022 走看看