ホームページ >ウェブフロントエンド >jsチュートリアル >`$scope.$emit` と `$scope.$on` は AngularJS コントローラーでのイベント通信をどのように促進しますか?
$scope.$emit と $scope.$on
$scope.$emit と $scope.$ を使用したコントローラーでのイベント通信は、コントローラー間のイベント通信を容易にするために不可欠な AngularJS メソッドです。ただし、効果的な実装には、その正確な動作を理解することが重要です。
$emit メソッド
$emit は、コントローラーからイベントをディスパッチし、スコープ階層を通じて上向きに送信します。 。これにより、コントローラーが親スコープや他の子スコープと通信できるようになります。
$on メソッド
$on は、他のコントローラーによって発行されたイベントをリッスンします。そのコールバック関数は、渡されたデータなど、発行されたイベントに関する詳細を含むイベント オブジェクトを受け取ります。
一致するイベント名
$emit と $on を使用する場合、重要です。一致するイベント名を使用します。イベント名によって、どのコントローラがイベントを受信するかが決まります。
スコープの関係
コントローラのスコープ間の関係によって、どの通信方法が有効かが決まります。
親子関係
において親子スコープ関係、親コントローラー (送信) の $broadcast と子コントローラー (リスニング) の $on で十分です。
例:
function firstCtrl($scope) { $scope.$broadcast('someEvent', [1,2,3]); } function secondCtrl($scope) { $scope.$on('someEvent', function(event, mass) { console.log(mass); }); }
親子関係がない場合
親子関係がない場合関係を構築し、コントローラーに $rootScope を挿入し、$rootScope.$broadcast を使用すると、イベントがすべてのスコープに確実に到達します。
例:
function firstCtrl($rootScope) { $rootScope.$broadcast('someEvent', [1,2,3]); }
イベント子から親へのディスパッチ
子からイベントをディスパッチするには親スコープにするには、子コントローラーで $scope.$emit を使用し、親コントローラーで $scope.$on を使用します。
例:
function firstCtrl($scope) { $scope.$on('someEvent', function(event, data) { console.log(data); }); } function secondCtrl($scope) { $scope.$emit('someEvent', [1,2,3]); }
以上が`$scope.$emit` と `$scope.$on` は AngularJS コントローラーでのイベント通信をどのように促進しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。