각도에서의 $broadcast(), $emit() 및 $on() 사용법JS

각도에서의 $broadcast(), $emit() 및 $on() 사용법JS

이해는 합니다.$Broadcast(),$Emit()그리고.$On()는 하나의 컨트롤러에서 이벤트를 발생시키고 다른 컨트롤러에서 처리하는데 사용됩니다.가능하다면 제가 처음이라 위의 3가지 사용법에 대한 실시간 예를 들어주실 수 있나요?angular JS?

아래 링크를 통해 기본적인 사용법을 이해했습니다.

http://www.binaryintellect.net/articles/5d8be0b6-e294-457e-82b0-ba7cc10cae0e.aspx

$140

스코프 계층을 통해 이벤트 이름을 위쪽으로 디스패치하여 등록된 사용자에게 통지합니다.$rootScope.Scope청취자.이벤트 라이프 사이클은 다음 범위부터 시작됩니다.$emit가 호출되었습니다.이벤트는 루트 스코프를 향해 위쪽으로 이동하며 도중에 등록된 모든 청취자를 호출합니다.청취자 중 하나가 이벤트를 취소하면 이벤트가 전파되지 않습니다.

$140

이벤트명을 모든 자 스코프(및 그 자 스코프)에 디스패치 해, 등록자에게 통지합니다.$rootScope.Scope청취자.이벤트 라이프 사이클은 다음 범위부터 시작됩니다.$broadcast가 호출되었습니다.이 스코프상의 이벤트의 모든 청취자에게 통지됩니다.그 후 이벤트는 하위 범위를 향해 아래로 이동하고 도중에 등록된 모든 청취자를 호출합니다.이벤트를 취소할 수 없습니다.

$on

특정 유형의 이벤트를 리슨합니다.에 의해 발송된 이벤트를 수신할 수 있습니다.$broadcast그리고.$emit.

---

비주얼 데모:

데모 작업 코드, 스코프 트리(부모/자녀 관계):
http://plnkr.co/edit/am6IDw?p=preview

메서드 호출을 나타냅니다.

  $scope.$on('eventEmitedName', function(event, data) ...
  $scope.broadcastEvent
  $scope.emitEvent

• 브로드캐스트:부모에서 자녀(부모->자녀 컨트롤러)로 값을 전달할 수 있습니다.
• 내보내기: 값을 자녀에서 부모에게 전달할 수 있습니다(자녀 -> 부모 컨트롤러).
• 점등: 에 의해 발송된 이벤트를 수신합니다.$broadcast또는$emit.

이 작은 예시는 어떻게 하면$rootScope는, 다른 컨트롤러의 자스코프에 의해서 리슨 되는 이벤트를 송신합니다.

(function(){


angular
  .module('ExampleApp',[]);

angular
  .module('ExampleApp')
  .controller('ExampleController1', Controller1);

Controller1.$inject = ['$rootScope'];

function Controller1($rootScope) {
  var vm = this, 
      message = 'Hi my children scope boy';

  vm.sayHi = sayHi;

  function sayHi(){
    $rootScope.$broadcast('greeting', message);
  }

}

angular
  .module('ExampleApp')
  .controller('ExampleController2', Controller2);

Controller2.$inject = ['$scope'];

function Controller2($scope) {
  var vm = this;

  $scope.$on('greeting', listenGreeting)

  function listenGreeting($event, message){
    alert(['Message received',message].join(' : '));
  }

}


})();

http://codepen.io/gpincheiraa/pen/xOZwqa

@gayathri bottom의 답변은 기술적으로 스코프 각도 개념과 그 구현에서의 모든 방법의 차이를 설명합니다.$scope그리고.$rootScope.

언급URL : https://stackoverflow.com/questions/37717493/usage-of-broadcast-emit-and-on-in-angularjs