why a service does not receive events

Question

I have some code that was working in a controller. I refactored and moved that functionality into a service. The code had an event listener:

$rootScope.$on( .....)

This was caught when it was in the controller, but does not catch the event when in a service. I have tried using $rootScope.$broadcast() and $rootScope.$emit() to signal the event but neither are caught in the service.

There is nothing special about the service code:

heartbeatService.$inject = [ '$rootScope', 'vcapChanService', 'eventService', 'logger' ];
function heartbeatService( $rootScope, vcapChanService, eventService, logger ) {
    //....
}

Question: how do I get a service to catch events on the root scope?

Edit with more info: The event is signaled from another service. And this event is caught in other controllers, but is NOT caught in another service. I have tried all variations of service/factory, emit/broadcast, etc. and none of them work. The service just does not catch the event but in all other regards works perfectly.

duplicate of http://stackoverflow.com/questions/16477123/how-do-i-use-on-in-a-service-in-angular — Peter Gelderbloem, Oct 14 '16 at 21:27
Specifically this answer in the linked duplicate: http://stackoverflow.com/a/16485628/1078110 — Matthew Green, Oct 14 '16 at 21:47
just use `$rootScope.$on(eventName, func....` Should work fine — charlietfl, Oct 14 '16 at 22:08
I have tried all of these suggestions and none of them work. The event mechanism appears to be working because other controllers do indeed catch the event. — Andres Gonzalez, Oct 15 '16 at 02:55
Never faced that. Maybe you forgot to load your service, or you don't call it ? — , Nov 10 '16 at 15:05

score 1 · Accepted Answer · answered Dec 15 '16 at 06:19

you can make service bridge between them and use watch

like

// bridge service
angular.module('app').service('bridge', function() {
        var self = this;
        self.events = [];
        self.fireEvent = function(eventName) {
            self.events.push(eventName);
        }

        self.removeEvent = function(eventName) {
            var ps = self.events.indexOf(eventName);
            if (ps != -1)
                self.events.splice(ps, 1) // to remove the event from events array 
        }
    })
    // firstService
angular.module('app').service('firstService', function($rootScope, bridge) {
        // make your business logic here 

        $rootScope.$watchCollection(function() {
            return bridge.events
        }, function(values) {
            var event = 'fileUploaded';
            if (values != null && values.indexOf(event)) {
                // make what you need to when the event fired
                // then remove the event from the the service 
                bridge.removeEvent(event)
            }
        })

    })
    // secondService
angular.module('app').service('secondService', function($rootScope, bridge) {
        var self = this;
        // make your business logic here 
        self.uploadFile = function(file) {
            bridge.fireEvent('fileUploaded');
        }
    })
    // controller
angular.module('app').controller('Appcontroller', function(secondService, $scope) {
    $scope.clickToUpload = function() {
        secondService.uploadFile( /* file */ );
    }


})

why a service does not receive events

1 Answers1