AngularJS Events $emit and $broadcast

Source: Internet
Author: User
Tags emit event listener

Message passing between pages (Child page, parent page), $emit bubbling event.

To dispatch events up the scope chain (from child scope to parent scope), we use the $emit () function

In a

$emit () event function, the event bubbles from the child scope to the parent scope. In the scope that generated the event

All scopes above will receive notification of this event.

$emit () $rootScope letter, need < Span style= "FONT-FAMILY:ANONYMOUSPRO; Font-size:small; " > $emit () this event.

The $emit () method has two parameters.

1.name of the event to be emitted by name(string) .

2.args(collection) a collection of parameters that are passed to the event listener as objects.

The $emit () method returns an event object (details about the event object, viewing the 20.3 section). any exceptions that are emitted from the listener are passed to the $exceptionHandler service.

To pass the event down (from the parent scope to the child scope), we use the $broadcast () function.

On the $broadcast () method, each child scope registered with the listener receives this information. Events propagate to the indirect scope of all instructions and the current scope, and each listener is invoked all the way down.

To listen to an event, we can use the $on () method. This method registers a listener for an event with a specific name . The event name is

Angular The type of event that is triggered in the

For example, we can listen for events when the routing change process is triggered:

Scope. $on (' $routeChangeStart ',

function (evt, next, current) {

A new route has been triggered.

});

Whenever the event $routeChangeStart(which broadcasts the event when the route is about to change) is triggered,

The listener (this function) will be called. Angular passes the Evt object as the first parameter to all the events being monitored, whether it's our custom event or the built-in Angular service.

AngularJS Events $emit and $broadcast

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.