$on と $broadcast はどのようにして Angular でイベント通信を有効にしますか?

Angular での $on および $broadcast によるイベント通信

Angular は、アプリケーション内のコンポーネントが通信できるようにする 2 つの基本的なイベント通信メソッド $on と $broadcast を提供します。お互いに。これらのメソッドがどのように機能するかを理解することは、Angular アプリケーションで効果的なイベント処理を行うために非常に重要です。

$broadcast
コントローラー内でイベントが発生したとき (footer.html 内の要素をクリックしたときなど) footerController は、$broadcast を使用してアプリケーションの他の部分にブロードキャストできます。このメソッドは、イベント名とオプションの引数をパラメーターとして受け取ります。

<code class="javascript">$rootScope.$broadcast('scanner-started');</code>

$on
他のコンポーネントは、$on を使用してこれらのイベントをサブスクライブできます。このメソッドはイベント名とコールバック関数をパラメータとして受け取ります。イベントがブロードキャストされると、コールバック関数がトリガーされ、$broadcast で渡された引数へのアクセスが提供されます。

<code class="javascript">$scope.$on('scanner-started', function(event, args) {

    // do what you want to do
});</code>

例
startScanner イベントを必要とする codeScannerController について考えてみましょう。コードのスキャンを開始します。 footerController は、要素がクリックされたときにこのイベントをトリガーできます。

<code class="javascript">// In footerController
$scope.startScanner = function() {

    $rootScope.$broadcast('scanner-started', { any: {} });
}

// In codeScannerController
$scope.$on('scanner-started', function(event, args) {

    var anything = args.any;
    // do what you want to do
});</code>

使用法
$on と $broadcast は、通常、異なるコンポーネント間の通信を容易にするために使用されます。コントローラー、サービス、ディレクティブ。これらにより、アプリケーション全体でイベントをトリガーして処理できるようになり、疎結合設計が可能になります。

以上が$on と $broadcast はどのようにして Angular でイベント通信を有効にしますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。