While searching for the reason why a properly defined factory is not loading, I came across this question. This led me to contemplate on the concept of services being "defined in an angular module".
Consider this example:
angular.module('d3', ['underscore'])
.factory('d3', ['$window', 'underscore',
function($window, _) {
if (!_.isObject($window.d3)) {
throw "services.d3: moment library missing!";
} else {
return $window.d3;
}
}
]);
Now, when attempting to load this service in another module as shown below:
angular.module("widgets.D3Widget", ['underscore'])
.controller("widgets.D3Widget.D3WidgetCtrl", [
"$scope",
"d3",
function(
$scope,
d3
) {
console.log(d3.select('body'));
//work goes here
}
]);
The service fails to load and results in an Angular error stating: "Error: [$injector:unpr] Unknown provider: d3Provider <- d3.
Even after consulting the Angular DI documentation, I found no solution.
This raises the question - what exactly does it mean to 'define a service'? Simply creating the module 'd3' doesn't suffice; it seems that the service needs to be added to another module, such as
angular.module("widgets.D3Widget", ['underscore', 'd3'])
, rather than just within a component of a module (like a controller or directive). Is my understanding correct?