angularjs - How do I broadcast from the http interceptor? -

using angularjs 1.2

my interceptor looks this:

        $httpprovider.interceptors.push(['$q', '$log', '$rootscope', function ($q, $log, $rootscope) {             return {                 'request': function(config) {                     $rootscope.$broadcast('spin');                     console.info('request!');                     return config || $q.when(config);                 }, ... 

in nav controller (which handles , binds loader/spinner view):

$rootscope.$watch('spin', function(event) {     console.info('spin');     $scope.spinner++; }); 

the broadcast seems happen once @ end of responses received, though can see many request! in console log.

how must manage global spinner/loader?

edit wish show loader/spinner in navbar whenever data being loaded.

the $watch function doesn't listen broadcast messages. watches changes on scope. in case, calling function whenever $rootscope.spin changes, gets called (by default) immediately, why got called once.

the $on function want here, listen broadcast events.

$rootscope.$on('spin', function(msg, data) {     console.info('spin');     $scope.spinner++; }); 

i've put complete working example if curious:

http://codepen.io/briangenisio/pen/wibhz