javascript - Unknown provider error when trying to inject a service from another module -
i've seen several posts on unknown provider errors none of them have addressed particular problem. i'm getting following error:
error: [$injector:unpr] unknown provider: useraccountresourceprovider <- useraccountresource <- adminuseraccountsctrl
here index.html:
<!doctype html> <html xmlns="http://www.w3.org/1999/xhtml" ng-app="rpms"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="x-ua-compatible" content="ie=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="https://code.jquery.com/jquery-1.11.2.min.js"></script> <!-- library scripts --> <script src="scripts/angular.js"></script> <script src="scripts/angular-resource.js"></script> <script src="scripts/angular-mocks.js"></script> <!-- application script --> <script src="app/app.js"></script> <!-- services --> <script src="common/services/common.services.js"></script> <script src="common/services/useraccountresource.js"></script> <script src="common/services/useraccountresourcemock.js"></script> <!-- admin controller scripts --> <script src="app/admin/adminuseraccountsctrl.js"></script> </head> <body onload="doonload()" class="administration-page user-account-page"> <div id="main" ng-controller="adminuseraccountsctrl vm"> <div class="main-content with-sidebar"> <h2>user accounts</h2> <div id="managed-user-accounts" class="module"> <table> <thead> <tr> <th>username</th> <th>full name</th> </tr> </thead> <tbody> <tr ng-repeat="account in vm.useraccounts"> <td>{{ account.username }}</td> <td>{{ account.firstname}} {{ account.lastname }}</td> </tr> </tbody> </table> </div> </div> </div> </body> </html>
here app.js;
(function() { "use strict"; var app = angular.module("rpms", ["common.services"]); }());
here second module - common.services.js:
(function() { "use strict"; angular .module("common.services", ["ngresource"]); }());
and here useraccountresource service declaration in common.services module:
(function() { "use strict"; angular .module("common.services") .factory("useraccountresource" ["$resource", useraccountresource]); function useraccountresource($resource) { return $resource("/api/accounts/:accountid"); } }());
finally, here adminuseraccountsctrl controller declaration - using causing error:
(function() { "use strict"; angular .module("rpms") .controller("adminuseraccountsctrl", ["useraccountresource", adminuseraccountsctrl]); function adminuseraccountsctrl(useraccountresource) { var vm = this; useraccountresource.query(function(data) { vm.useraccounts = data; }); } }());
i know useraccountresource created under common.services module common.services module included dependency of rpms module. why considered unknown provider?
thanks.
try add ,
after "useraccountresource"
this
.factory("useraccountresource", //, here missing ["$resource", useraccountresource]);
Comments
Post a Comment