javascript - How to inject third party dependencies into Directive controllers in Angularjs? -


i have directive controller follows.

 app.directive("dashboardapp", function(toastr){  return {      controller: function($scope, $rootscope){       }   } 

i have xhr interceptor 'angular-loading-bar' added dependency 'app'

 angular.module('myapp', ['angular-loading-bar', 'nganimate']) 

. interceptor isn't working in dashboardapp controller. how inject dependency directive controller.

it works automatically, include dependency , automatically display progress of $http requests.

injecting module application should trick. no need in injecting controller.

requirements: angularjs 1.2+

please check installation, , re-check following steps

include dependency

include loading bar dependency app. if want animations, include nganimate well. note: nganimate optional. installation options here.

angular.module('myapp', ['angular-loading-bar', 'nganimate']) 

include source files (via 1 of following methods)

include supplied js , css file (or create own css override defaults).

<link rel='stylesheet' href='build/loading-bar.min.css' type='text/css' media='all' /> <script type='text/javascript' src='build/loading-bar.min.js'></script> that's -- you're done! 

via bower:

$ bower install angular-loading-bar 

via npm:

$ npm install angular-loading-bar 

via cdn:

 <link rel='stylesheet' href='//cdnjs.cloudflare.com/ajax/libs/angular-loading-bar/0.9.0/loading-bar.min.css' type='text/css' media='all' />  <script type='text/javascript' src='//cdnjs.cloudflare.com/ajax/libs/angular-loading-bar/0.9.0/loading-bar.min.js'></scrip 

Comments