From 86bb51292f582badc2c5300d4d6c17ceab7a0a96 Mon Sep 17 00:00:00 2001 From: Damien CORNEAU Date: Thu, 8 Sep 2016 15:07:15 +0900 Subject: [PATCH 1/5] change page title for goodPracticeGuide01 --- contribution/zeppelinweb/goodPracticeGuide01.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/contribution/zeppelinweb/goodPracticeGuide01.md b/contribution/zeppelinweb/goodPracticeGuide01.md index 7580b776d6c..317bd0f5ac4 100644 --- a/contribution/zeppelinweb/goodPracticeGuide01.md +++ b/contribution/zeppelinweb/goodPracticeGuide01.md @@ -1,6 +1,6 @@ --- layout: sideMenu -title: "Defining Components" +title: "1 - Defining Components" description: "" group: nav-contrib-front menu: nav-contrib-front From d551928cbcbd24a9f957f5a6ce0aac83162b7d16 Mon Sep 17 00:00:00 2001 From: Damien CORNEAU Date: Thu, 8 Sep 2016 15:07:35 +0900 Subject: [PATCH 2/5] Add event dispatching documentation --- .../zeppelinweb/goodPracticeGuide02.md | 66 +++++++++++++++++++ 1 file changed, 66 insertions(+) create mode 100644 contribution/zeppelinweb/goodPracticeGuide02.md diff --git a/contribution/zeppelinweb/goodPracticeGuide02.md b/contribution/zeppelinweb/goodPracticeGuide02.md new file mode 100644 index 00000000000..c10762cb632 --- /dev/null +++ b/contribution/zeppelinweb/goodPracticeGuide02.md @@ -0,0 +1,66 @@ +--- +layout: sideMenu +title: "2 - Event dispatching" +description: "" +group: nav-contrib-front +menu: nav-contrib-front +--- + + +# Event dispatching in the Angular Source Code + +
+AngularJS provides an Event dispatching system allow the communication between controllers or services and controllers. + +`$broadcast` dispatches the event downwards through the child scopes + +`$emit` dispatches the event upwards through the scope hierarchy + +`$on` catches the event passing by that scope + +
+You can usually see it being used from `$rootScope` or `$scope` + +``` +$scope.$broadcast('eventName', arg); +$rootScope.$broadcast('eventName', arg); + +$scope.$emit('eventName', arg); +$rootScope.$emit('eventName', arg); + +$scope.$on('eventToCatch', function); +$rootScope.$on('eventToCatch', function); +``` + +Now, there is a few things to know about using it from `$rootScope`: + +* Both `$rootScope.$emit` and `$rootScope.$broadcast` go through child scopes since `$rootScope` do not have a parent +* `$rootScope.$emit` can only be received by `$rootScope.$on` +* `$rootScope.$broadcast` can be received by `$rootScope.$on` and `$scope.$on` +* `$rootScope.$on` listener needs to be removed by hand (Memory leak if forgotten) + + +#### How we are using it in the project + +* Usage of event dispatching should be limited if possible +* We only use `$rootScope.$broadcast` and `$scope.$on` for event dispatching/catching + + +#### Performances + +Using `$broadcast` might seem not optimum if we consider the description we have above. + +However it is optimized to only go through branches that have a matching event binding. +(cf. [this post](http://www.bennadel.com/blog/2724-scope-broadcast-is-surprisingly-efficient-in-angularjs.htm)) From 63313cc08bde189d1b1ec27811287ed08a434242 Mon Sep 17 00:00:00 2001 From: Damien CORNEAU Date: Thu, 8 Sep 2016 15:13:21 +0900 Subject: [PATCH 3/5] Change uppercasing a bit --- contribution/zeppelinweb/goodPracticeGuide02.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/contribution/zeppelinweb/goodPracticeGuide02.md b/contribution/zeppelinweb/goodPracticeGuide02.md index c10762cb632..4d301726327 100644 --- a/contribution/zeppelinweb/goodPracticeGuide02.md +++ b/contribution/zeppelinweb/goodPracticeGuide02.md @@ -1,6 +1,6 @@ --- layout: sideMenu -title: "2 - Event dispatching" +title: "2 - Event Dispatching" description: "" group: nav-contrib-front menu: nav-contrib-front @@ -19,7 +19,7 @@ See the License for the specific language governing permissions and limitations under the License. --> -# Event dispatching in the Angular Source Code +# Event Dispatching in Angular
AngularJS provides an Event dispatching system allow the communication between controllers or services and controllers. From 850b9084930c316cdec0fd4c6209ae881f98f2a8 Mon Sep 17 00:00:00 2001 From: Damien CORNEAU Date: Fri, 9 Sep 2016 13:33:11 +0900 Subject: [PATCH 4/5] Fix grammar errors --- contribution/zeppelinweb/goodPracticeGuide02.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/contribution/zeppelinweb/goodPracticeGuide02.md b/contribution/zeppelinweb/goodPracticeGuide02.md index 4d301726327..895cb0ff576 100644 --- a/contribution/zeppelinweb/goodPracticeGuide02.md +++ b/contribution/zeppelinweb/goodPracticeGuide02.md @@ -22,7 +22,7 @@ limitations under the License. # Event Dispatching in Angular
-AngularJS provides an Event dispatching system allow the communication between controllers or services and controllers. +AngularJS provides an Event dispatching system allowing the communication between controllers or services and controllers. `$broadcast` dispatches the event downwards through the child scopes @@ -44,9 +44,9 @@ $scope.$on('eventToCatch', function); $rootScope.$on('eventToCatch', function); ``` -Now, there is a few things to know about using it from `$rootScope`: +Now, there are a few things to know about using it from `$rootScope`: -* Both `$rootScope.$emit` and `$rootScope.$broadcast` go through child scopes since `$rootScope` do not have a parent +* Both `$rootScope.$emit` and `$rootScope.$broadcast` go through child scopes since `$rootScope` doesn't have a parent * `$rootScope.$emit` can only be received by `$rootScope.$on` * `$rootScope.$broadcast` can be received by `$rootScope.$on` and `$scope.$on` * `$rootScope.$on` listener needs to be removed by hand (Memory leak if forgotten) @@ -60,7 +60,7 @@ Now, there is a few things to know about using it from `$rootScope`: #### Performances -Using `$broadcast` might seem not optimum if we consider the description we have above. +Using `$broadcast` might not seem optimum if we consider the description we have above. However it is optimized to only go through branches that have a matching event binding. (cf. [this post](http://www.bennadel.com/blog/2724-scope-broadcast-is-surprisingly-efficient-in-angularjs.htm)) From 42cc497fefb48112bfba1c3744b39fd19a33ad14 Mon Sep 17 00:00:00 2001 From: Damien CORNEAU Date: Fri, 9 Sep 2016 13:51:39 +0900 Subject: [PATCH 5/5] add comma --- contribution/zeppelinweb/goodPracticeGuide02.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/contribution/zeppelinweb/goodPracticeGuide02.md b/contribution/zeppelinweb/goodPracticeGuide02.md index 895cb0ff576..b3d39f2801c 100644 --- a/contribution/zeppelinweb/goodPracticeGuide02.md +++ b/contribution/zeppelinweb/goodPracticeGuide02.md @@ -62,5 +62,5 @@ Now, there are a few things to know about using it from `$rootScope`: Using `$broadcast` might not seem optimum if we consider the description we have above. -However it is optimized to only go through branches that have a matching event binding. +However, it is optimized to only go through branches that have a matching event binding. (cf. [this post](http://www.bennadel.com/blog/2724-scope-broadcast-is-surprisingly-efficient-in-angularjs.htm))