How to install an Angular Directive in meanJS

Question

I've been trying to install an Angular Directive in a meanJS folderstructure. But I'm getting an error when trying to add the directive to my controller.

Error: [$injector:unpr] Unknown provider: duScrollProvider <- duScroll <- HomeController http://errors.angularjs.org/1.3.20/$injector/unpr?p0=duScrollProvider%20%3C-NaNuScroll%20%3C-%20HomeController at http://localhost:3000/lib/angular/angular.js:63:12 at http://localhost:3000/lib/angular/angular.js:4031:19 at Object.getService [as get] (http://localhost:3000/lib/angular/angular.js:4178:39) at http://localhost:3000/lib/angular/angular.js:4036:45 at getService (http://localhost:3000/lib/angular/angular.js:4178:39) at Object.invoke (http://localhost:3000/lib/angular/angular.js:4210:13) at extend.instance (http://localhost:3000/lib/angular/angular.js:8516:21) at http://localhost:3000/lib/angular/angular.js:7762:13 at forEach (http://localhost:3000/lib/angular/angular.js:334:20) at nodeLinkFn (http://localhost:3000/lib/angular/angular.js:7761:11)

The directive I'm trying to install is: https://github.com/oblador/angular-scroll

I'm on version 0.4.2

However I've also tried other "scroll" directives but get the same error.

I'm trying to add it in my home.client.controller.js like so:

angular.module('core').controller('HomeController', ['$scope', 'Authentication', 'duScroll', function ($scope, Authentication, duScroll) {

I've also tried adding it to the end of core.

angular.module('core', ['duScroll']).controller('HomeController', ['$scope', 'Authentication', function ($scope, Authentication) {

As for the answer below I tried that as well.

I added 'public/lib/angular-scroll/angular-scroll.js' to the default.js file located in config/assets/default.js

And I also added duScroll in config.js located in: modules/core/client/app/config.js

var applicationModuleVendorDependencies = ['ngResource', 'ngAnimate', 'ngMessages', 'ui.router', 'ui.bootstrap', 'ui.utils', 'angularFileUpload', 'duScroll'];

However I'm still getting the same error.

All the documentation says that I should use bower install or npm install to install these directives. But since it's a modular folder structure I have no idea how to get it to recognize the directive. I've tried including it, in all of the places I could think of might work.

Any help figuring out how to install a directive in a meanjs folder structure would be greatly appreciated!

Thanks

pgrodrigues pgrodrigues · Accepted Answer · 2016-02-03T09:24:52

I gave an answer to a similar question here.

If you're using version 0.3.3 you have to update the config/env/all.js file where you place the path to your dependency file and in case it is an angular 3rd party module you also have to inject it in your main angular module which can be done in the file public/config.js.

If you're using version 0.4.2 you have to update the config/assets/default.js file where you place the path to your dependency file and in case it is an angular 3rd party module you also have to inject it in your main angular module which can be done in the file modules/core/client/app/config.js.

How to install an Angular Directive in meanJS

1 Answers