$rootScope.$broadcast not propergated when fired/propergated inside module.config()

[James Morgan]

Hi all, I have been trying to implemented a simple event trigger when ever I make a http request so I can show/hide a loading modal window.

One problem I ran into is that when ever I broadcast the event inside my configured $httpProvider I see the invocation of it but not broadcast is herd.

I see the log lines "onOpenLoadingModal should be broadcast" but the broadcast is not herd by my corresponding controller, is this to be expected?

My other boradcasts from inside my factory "myHttpInterceptor" works fine and as expected.

Many thanks for any help or advice

My Code (CoffeeScript):

    app.config(['$httpProvider', ($httpProvider) =>
        ## Add interceptor to $httpProivider
        $httpProvider.responseInterceptors.push('myHttpInterceptor')
       
        spinnerFunction = (data, headersGetter) ->
            log "onOpenLoadingModal should be broadcast"
            scope = angular.injector(['ng']).get('$rootScope')
            scope.$broadcast('onOpenLoadingModal')
            data
       
        ## Set spinner function
        $httpProvider.defaults.transformRequest.push(spinnerFunction)
    ])
    ## register the interceptor as a service, intercepts ALL angular ajax http calls
    .factory('myHttpInterceptor', ['$rootScope', '$q','$window', ($rootScope, $q, $window) ->
        (promise) ->
            promise.then((response) =>
                    $rootScope.$broadcast('onCloseLoadingModal')
                    response
                , (response) =>
                    $rootScope.$broadcast('onCloseLoadingModal')
                    $q.reject(response)
            )
    ]);

[Peter Bacon Darwin]

I suspect the problem is that angular.injector(['ng']) is creating a "new" injector that is different to the one used by the rest of the application, and so broadcasting on that injector's rootScope is not going to be picked up by the other injector's rootscope.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
 
 

[James Morgan]

Just for clarification what should angular.injector(['ng']) be i.e. when does the 'ng' I was udner the impression this is simple the angular JS root application?

I define my application module like this incase it helps:

angular.module('myApp', [])

James

[Peter Bacon Darwin]

"ng" is the module that contains all the core AngularJS services and directives.

angular.injector(['ng']) is basically saying, create me an injector and load up the ng module into that.

The ng-app="myApp" directive is basically saying angular.injector(['myApp', 'ng'])

[James Morgan]

I have tried switching which directive the injector uses with no look:

I have tried the following:

• angular.injector(['ng']).get('$rootScope')

• angular.injector(['ng', 'myApp']).get('$rootScope')
• angular.injector(['myApp', 'ng']).get('$rootScope')
  

The above do nothing when the event is fired.

This:

• angular.injector(['myApp']).get('$rootScope')

throws an error: Error: Unknown provider: $routeProvider from myApp | Cause: undefined

My Controller looks like the following:

LoadingModalCtrl = ($scope, $rootScope) ->

    $scope.$on('onOpenLoadingModal', (e, data) ->
        log "onOpenLoadingModal"
    )
   
    $scope.$on('onCloseLoadingModal', (e, data) ->
        log "onCloseLoadingModal"
    )


Any ideas if this is the correct way to implement this feature or am I barking up the wrong tree?

James

[Peter Bacon Darwin]

The point is that called angular.injector creates an "entirely new" injector, which is a completely different object to the one that is used to bootstrap the application.

You need to get hold of the application's injector.

[James Morgan]

I see, I got it to work with this little hack, (not sure if it is a hack?)

scope = angular.element(document).injector().get('$rootScope')

I make an assumption the current document is my angular application and it now works!

Thankyou.