Bagaimanakah `$scope.$emit` dan `$scope.$on` Memudahkan Komunikasi Acara dalam Pengawal AngularJS?

Komunikasi Acara dalam Pengawal menggunakan $scope.$emit dan $scope.$on

$scope.$emit dan $scope.$ on adalah kaedah AngularJS yang penting untuk memudahkan komunikasi acara antara pengawal. Walau bagaimanapun, memahami gelagat tepat mereka adalah penting untuk pelaksanaan yang berkesan.

Kaedah $emit

$emit menghantar peristiwa daripada pengawal, menghantarnya ke atas melalui hierarki skop . Ia membolehkan pengawal berkomunikasi dengan skop induk dan skop kanak-kanak yang mungkin lain.

Kaedah $on

$on mendengar acara yang dipancarkan oleh pengawal lain. Fungsi panggil baliknya menerima objek acara dengan butiran tentang acara yang dipancarkan, termasuk data yang dihantar bersama.

Padanan Nama Acara

Apabila menggunakan $emit dan $on, ia penting untuk menggunakan nama acara yang sepadan. Nama acara menentukan pengawal yang akan menerima acara.

Perhubungan Skop

Hubungan antara skop pengawal menentukan kaedah komunikasi yang berkesan.

Hubungan Ibu Bapa-Anak

Dalam hubungan skop ibu bapa-anak, $siaran dalam pengawal induk (memancarkan) dan $on dalam pengawal anak (mendengar) sudah memadai.

Contoh:

function firstCtrl($scope) {
    $scope.$broadcast('someEvent', [1,2,3]);
}

function secondCtrl($scope) {
    $scope.$on('someEvent', function(event, mass) { console.log(mass); });
}

Tiada Hubungan Ibu Bapa-Anak

Jika tiada ibu bapa-anak perhubungan, menyuntik $rootScope dalam pengawal dan menggunakan $rootScope.$broadcast akan memastikan acara mencapai semua skop.

Contoh:

function firstCtrl($rootScope) {
    $rootScope.$broadcast('someEvent', [1,2,3]);
}

Acara Penghantaran daripada Anak kepada Ibu Bapa

Untuk menghantar acara daripada anak kepada skop induk, gunakan $scope.$emit dalam pengawal anak dan $scope.$on dalam pengawal induk.

Contoh:

function firstCtrl($scope) {
    $scope.$on('someEvent', function(event, data) { console.log(data); });
}

function secondCtrl($scope) {
    $scope.$emit('someEvent', [1,2,3]);
}

Atas ialah kandungan terperinci Bagaimanakah `$scope.$emit` dan `$scope.$on` Memudahkan Komunikasi Acara dalam Pengawal AngularJS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!