As I continue to build applications with AngularJS, I see how strong the ecosystem is. While there aren’t quite as many plugins for Angular as there are for JQuery, many of the JQuery plugins have been wrapped up as Angular directives.
One of the issues I banged my head against a couple of times when using a new directive was how many places I had to modify code, and the totally non intuitive error messages that were displayed.
Here are the places you need to modify if you want to use a directive:
- a module definition (your app or a controller). You need to add the directive to the list of dependencies:
var controllers = angular.module("controllers", [ "localytics.directives",'ngModal' ]);.
- the karma.conf.js file. This file sets up the environment for your unit tests. You want to set up the
index.html or your karma configuration file, you will see this error message in your console:
Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module controllers due to:
Error: [$injector:modulerr] Failed to instantiate module ngModall due to:
Error: [$injector:nomod] Module ‘ngModall’ is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
And the app won’t start.
Hope this helps someone else avoid some head banging.