How do I create a custom event in an AngularJs service

javascript angularjs events custom-events
rmg.n3t picture rmg.n3t · Jun 9, 2014 · Viewed 59.6k times · Source

I am working on an AngularJs project. I have a service which sets and removes events on some buttons. This service is utilized by another service which I do not want to interact directly with the buttons. However I would like a button click event to be filtered up through the first service and handled in the second one. Since I don't want the second service to be aware of the buttons, I figure I will need to create a custom event in the first service. How can I create a custom event and fire it when a button is clicked?

Thanks in advance.

Answer

Chancho picture Chancho · Jun 10, 2014

If you want to send an event between services/directives use broadcast:

$rootScope.$broadcast('buttonPressedEvent');

And recieve it like this:

$rootScope.$on('buttonPressedEvent', function () {
             //do stuff
        })

Related questions

Watch multiple $scope attributes

Is there a way to subscribe to events on multiple objects using $watch E.g. $scope.$watch('item1, item2', function () { });

Read More
AngularJS directives attributes access from the controller

I am trying to access the attributes of a directive in the controller function. However, by the time I access it, it is undefined. I noticed that if I do a simple timer it works. Is there a way to …

Read More
AngularJS : What is the best way to bind to a global event in a directive

Imagine the situation in AngularJS where you want to create a directive that needs to respond to a global event. In this case, let's say, the window resize event. What is the best approach for this? The way I see …

Read More