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

Bekerja dengan $scope.$emit dan $scope.$on

Dalam AngularJS, komunikasi antara pengawal boleh dicapai menggunakan $scope Kaedah .$emit dan $scope.$on. Kaedah ini memudahkan komunikasi berasaskan peristiwa, membenarkan data atau isyarat disiarkan dari satu pengawal ke pengawal yang lain.

$skop.$emit dan $skop.$on: Diterangkan

• $skop.$emit: Memancarkan peristiwa yang disebarkan ke atas melalui skop hierarki.
• $scope.$on: Mendengar acara dengan nama tertentu dan melaksanakan fungsi panggil balik apabila acara dicetuskan.

Perhubungan Skop Ibu Bapa-Anak

Keberkesanan kaedah ini bergantung kepada hubungan ibu bapa-anak antara skop pengawal yang terlibat. Dua jenis penghantaran acara tersedia:

• $skop.$siaran: Menghantar acara ke bawah ke semua skop kanak-kanak.
• $skop. $emit: Menghantar acara ke atas melalui skop hierarki.

Contoh Senario

1. Hubungan Skop Ibu Bapa-Anak:

Jika skop pengawal pertama ($scope.$emit) ialah ibu bapa pengawal kedua ($scope.$on), kod berikut sepatutnya berfungsi:

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

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

2. Tiada Hubungan Skop Ibu Bapa-Anak:

Jika tiada hubungan ibu bapa-anak, anda boleh menyuntik $rootScope ke dalam pengawal dan menyiarkan acara ke semua skop kanak-kanak:

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

3. Penghantaran daripada Anak kepada Ibu Bapa:

Untuk menghantar acara daripada pengawal anak kepada pengawal ibu bapa, gunakan $scope.$emit. Jika skop pengawal pertama ($scope.$on) ialah induk pengawal kedua ($scope.$emit):

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

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

Dengan memahami cara $scope.$emit dan $scope. $pada kerja, anda boleh berkomunikasi dengan berkesan antara pengawal dalam aplikasi AngularJS anda.

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