Angularjs $broadcast $emit $on event triggers a value transfer between controllers

Use Angularjs, find the controller between the value of transmission, more troublesome, after a few articles will be said several ways.

One, Angularjs $broadcast $emit $on thought of handling

Within a controller, a method is triggered through an event, in which a variable is defined in a method by $broadcast or $emit, which is obtained through $on in the parent and child controller.

Second, the example illustrates the usage of the Angularjs $broadcast $emit $on

1,html Code

View copy print?

2. <div ng-controller="Parentctrl">//Parent
4. <div ng-controller="Selfctrl">//own
6. <a ng-click="click ()">click me</a>
8. <div ng-controller="Childctrl"></div>//Sub-level /c2>
10. </div>
12. <div ng-controller="Broctrl"></div>//Peer
14. </div>

2,js Code

View copy print?

2. Phonecatcontrollers.controller (' Selfctrl ', function ($scope) {
4. $scope. Click = function () {
6. $scope.  $broadcast (' to-child ', ' child ');
8. $scope.  $emit (' to-parent ', ' parent ');
10. }
12. });
16. Phonecatcontrollers.controller (' Parentctrl ', function ($scope) {
18. $scope. $on (' to-parent ', function (d,data) {
20. Console.log (data); //parent can get value
22. });
24. $scope. $on (' to-child ', function (d,data) {
26. Console.log (data); //Sub-level not getting a value
28. });
30. });
34. Phonecatcontrollers.controller (' Childctrl ', function ($scope) {
36. $scope. $on (' to-child ', function (d,data) {
38. Console.log (data); //child can get value
40. });
42. $scope. $on (' to-parent ', function (d,data) {
44. Console.log (data); //Parent not getting a value
46. });
48. });
52. Phonecatcontrollers.controller (' Broctrl ', function ($scope) {
54. $scope. $on (' to-parent ', function (d,data) {
56. Console.log (data); //No value at Peer
58. });
60. $scope. $on (' to-child ', function (d,data) {
62. Console.log (data); //No value at Peer
64. });
66. });

3. Click on the output of the Me

1. Child
2. Parent

The value assigned by $broadcast can only be obtained by the child, and $emit assigned value can only be obtained by the parent, and nothing at the level can be obtained.

Angularjs $broadcast $emit $on event triggers a value transfer between controllers