$on 및 $broadcast는 어떻게 Angular에서 이벤트 통신을 활성화합니까?

Angular에서 $on 및 $broadcast를 사용한 이벤트 통신

Angular는 $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 중국어 웹사이트의 기타 관련 기사를 참조하세요!