วิธียกเลิกการสมัครรับข้อมูลการออกอากาศใน angularJS วิธีลบฟังก์ชั่นที่ลงทะเบียนผ่านทาง $ on

ฉันได้ลงทะเบียนผู้ฟังของฉันไปยังเหตุการณ์ $ broadcast โดยใช้ $ on function

$scope.$on("onViewUpdated", this.callMe);

และฉันต้องการยกเลิกการลงทะเบียนผู้ฟังนี้ตามกฎทางธุรกิจเฉพาะ แต่ปัญหาของฉันคือเมื่อลงทะเบียนแล้วฉันไม่สามารถยกเลิกการลงทะเบียนได้

มีวิธีการใดใน AngularJS ที่จะยกเลิกการลงทะเบียนผู้ฟังหรือไม่? วิธีการเช่น $ สำหรับการยกเลิกการลงทะเบียนกิจกรรมนี้อาจเป็น $ off เพื่อให้เป็นไปตามตรรกะทางธุรกิจที่ฉันสามารถพูดได้

 $scope.$off("onViewUpdated", this.callMe);

และฟังก์ชั่นนี้หยุดถูกเรียกเมื่อมีคนออกอากาศเหตุการณ์ "onViewUpdated"

ขอบคุณ

แก้ไข : ฉันต้องการยกเลิกการลงทะเบียนฟังจากฟังก์ชั่นอื่น ไม่ใช่ฟังก์ชั่นที่ฉันลงทะเบียน

คุณต้องจัดเก็บฟังก์ชันที่ส่งคืนและเรียกใช้เพื่อยกเลิกการสมัครจากกิจกรรม

var deregisterListener = $scope.$on("onViewUpdated", callMe);
deregisterListener (); // this will deregister that listener

พบได้ในซอร์สโค้ด :) อย่างน้อยใน 1.0.4 ฉันจะโพสต์รหัสเต็มตั้งแต่สั้น

/**
  * @param {string} name Event name to listen on.
  * @param {function(event)} listener Function to call when the event is emitted.
  * @returns {function()} Returns a deregistration function for this listener.
  */
$on: function(name, listener) {
    var namedListeners = this.$$listeners[name];
    if (!namedListeners) {
      this.$$listeners[name] = namedListeners = [];
    }
    namedListeners.push(listener);

    return function() {
      namedListeners[indexOf(namedListeners, listener)] = null;
    };
},

ยังดูเอกสาร

เมื่อดูคำตอบส่วนใหญ่พวกเขาดูเหมือนจะซับซ้อนเกินไป เชิงมุมได้สร้างกลไกในการยกเลิกการลงทะเบียน

ใช้ฟังก์ชันการลงทะเบียนที่คืนค่าโดย$on :

// Register and get a handle to the listener
var listener = $scope.$on('someMessage', function () {
    $log.log("Message received");
});

// Unregister
$scope.$on('$destroy', function () {
    $log.log("Unregistering listener");
    listener();
});

รหัสนี้เหมาะกับฉัน:

$rootScope.$$listeners.nameOfYourEvent=[];

แก้ไข: วิธีที่ถูกต้องในการทำเช่นนี้คือในคำตอบของ @ LiviuT!

คุณสามารถขยายขอบเขตของ Angular ได้ตลอดเวลาเพื่อให้คุณสามารถลบผู้ฟังเช่นนี้ได้:

//A little hack to add an $off() method to $scopes.
(function () {
  var injector = angular.injector(['ng']),
      rootScope = injector.get('$rootScope');
      rootScope.constructor.prototype.$off = function(eventName, fn) {
        if(this.$$listeners) {
          var eventArr = this.$$listeners[eventName];
          if(eventArr) {
            for(var i = 0; i < eventArr.length; i++) {
              if(eventArr[i] === fn) {
                eventArr.splice(i, 1);
              }
            }
          }
        }
      }
}());

และนี่คือวิธีการใช้งาน:

  function myEvent() {
    alert('test');
  }
  $scope.$on('test', myEvent);
  $scope.$broadcast('test');
  $scope.$off('test', myEvent);
  $scope.$broadcast('test');

และนี่คือเสียงพึมพำของมันในการดำเนินการ

หลังจากตรวจแก้จุดบกพร่องรหัสฉันสร้างฟังก์ชั่นของตัวเองเช่นเดียวกับคำตอบ "blesh" นี่คือสิ่งที่ฉันทำ

MyModule = angular.module('FIT', [])
.run(function ($rootScope) {
        // Custom $off function to un-register the listener.
        $rootScope.$off = function (name, listener) {
            var namedListeners = this.$$listeners[name];
            if (namedListeners) {
                // Loop through the array of named listeners and remove them from the array.
                for (var i = 0; i < namedListeners.length; i++) {
                    if (namedListeners[i] === listener) {
                        return namedListeners.splice(i, 1);
                    }
                }
            }
        }
});

ดังนั้นโดยการแนบฟังก์ชั่นของฉันไปที่ $ rootcope ตอนนี้มันสามารถใช้ได้กับคอนโทรลเลอร์ทั้งหมดของฉัน

และในรหัสของฉันฉันกำลังทำ

$scope.$off("onViewUpdated", callMe);

ขอบคุณ

แก้ไข: วิธี AngularJS การทำเช่นนี้อยู่ในคำตอบของ @ LiviuT! แต่ถ้าคุณต้องการที่จะยกเลิกการลงทะเบียนฟังในขอบเขตอื่นและในเวลาเดียวกันต้องการที่จะอยู่ห่างจากการสร้างตัวแปรท้องถิ่นเพื่อให้การอ้างอิงของฟังก์ชั่นการยกเลิกการลงทะเบียน นี่เป็นทางออกที่เป็นไปได้

@ คำตอบของ LiviuT นั้นยอดเยี่ยม แต่ดูเหมือนว่าจะมีคนจำนวนมากสงสัยว่าจะสามารถเข้าถึงฟังก์ชั่นฉีกขาดของ handler ได้อีกครั้งจากขอบเขตหรือฟังก์ชัน $ $ อื่น ๆ หากคุณต้องการทำลายมันจากที่อื่น ๆ @ РустемМусабековคำตอบของใช้งานได้ดีมาก แต่ก็ไม่ได้เป็นไปในทางที่ผิด (และขึ้นอยู่กับสิ่งที่ควรจะเป็นรายละเอียดการใช้งานส่วนตัวซึ่งสามารถเปลี่ยนแปลงได้ตลอดเวลา) และจากที่นั่นมันก็ซับซ้อนมากขึ้น ...

ฉันคิดว่าคำตอบง่าย ๆ ที่นี่คือการอ้างอิงฟังก์ชันการดึงลง ( offCallMeFnในตัวอย่างของเขา) ในตัวจัดการเองและจากนั้นเรียกว่าขึ้นอยู่กับเงื่อนไขบางประการ อาจเป็นข้อโต้แย้งที่คุณรวมไว้ในเหตุการณ์ที่คุณออกอากาศหรือ $ emit ผู้จัดการสามารถฉีกตัวเองเมื่อใดก็ตามที่คุณต้องการทุกที่ที่คุณต้องการแบกเมล็ดพันธุ์แห่งการทำลายล้างของตัวเอง ชอบมาก

// Creation of our handler:
var tearDownFunc = $rootScope.$on('demo-event', function(event, booleanParam) {
    var selfDestruct = tearDownFunc;
    if (booleanParam === false) {
        console.log('This is the routine handler here. I can do your normal handling-type stuff.')
    }
    if (booleanParam === true) {
        console.log("5... 4... 3... 2... 1...")
        selfDestruct();
    }
});

// These two functions are purely for demonstration
window.trigger = function(booleanArg) {
    $scope.$emit('demo-event', booleanArg);
}
window.check = function() {
    // shows us where Angular is stashing our handlers, while they exist
    console.log($rootScope.$$listeners['demo-event'])
};

// Interactive Demo:

>> trigger(false);
// "This is the routine handler here. I can do your normal handling-type stuff."

>> check();
// [function] (So, there's a handler registered at this point.)  

>> trigger(true);
// "5... 4... 3... 2... 1..."

>> check();
// [null] (No more handler.)

>> trigger(false);
// undefined (He's dead, Jim.)

สองความคิด:

1. นี่เป็นสูตรที่ยอดเยี่ยมสำหรับตัวจัดการแบบเรียกใช้ครั้งเดียว เพียงแค่วางเงื่อนไขและเรียกใช้selfDestructทันทีที่เสร็จสิ้นภารกิจฆ่าตัวตาย
2. ฉันสงสัยว่าขอบเขตการกำเนิดจะถูกทำลายอย่างถูกต้องและเก็บขยะหรือไม่เนื่องจากคุณกำลังอ้างอิงกับตัวแปรที่ปิดอยู่ คุณต้องใช้ล้านสิ่งเหล่านี้เพื่อให้เป็นปัญหาความจำ แต่ฉันอยากรู้ หากใครมีข้อมูลเชิงลึกโปรดแบ่งปัน

ลงทะเบียนเบ็ดเพื่อยกเลิกการรับฟังผู้บรรยายเมื่อส่วนประกอบถูกลบ:

$scope.$on('$destroy', function () {
   delete $rootScope.$$listeners["youreventname"];
});  

ในกรณีที่คุณต้องเปิดและปิดฟังหลาย ๆ ครั้งคุณสามารถสร้างฟังก์ชั่นที่มีbooleanพารามิเตอร์

function switchListen(_switch) {
    if (_switch) {
      $scope.$on("onViewUpdated", this.callMe);
    } else {
      $rootScope.$$listeners.onViewUpdated = [];
    }
}

'$ on' จะส่งคืนฟังก์ชันเพื่อยกเลิกการลงทะเบียน

 var unregister=  $rootScope.$on('$stateChangeStart',
            function(event, toState, toParams, fromState, fromParams, options) { 
                alert('state changing'); 
            });

คุณสามารถเรียกใช้ฟังก์ชัน unregister () เพื่อยกเลิกการลงทะเบียนฟัง

วิธีหนึ่งคือการทำลายผู้ฟังเมื่อคุณทำเสร็จแล้ว

var removeListener = $scope.$on('navBarRight-ready', function () {
        $rootScope.$broadcast('workerProfile-display', $scope.worker)
        removeListener(); //destroy the listener
    })