尝试从另一个模块注入服务时出现未知的提供程序错误

时间:2015-07-13 19:12:07

标签: javascript angularjs

我看过几篇关于未知提供程序错误的帖子,但没有一篇解决我的特定问题。我收到以下错误:

Error: [$injector:unpr] Unknown provider: userAccountResourceProvider <- userAccountResource <- AdminUserAccountsCtrl

这是我的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 as 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>

这是我的app.js;

(function() {
    "use strict";

    var app = angular.module("rpms",
                             ["common.services"]);

}());

这是我的第二个模块 - common.services.js:

(function() {
    "use strict";

    angular
        .module("common.services",
                ["ngResource"]);
}());

这是common.services模块中的userAccountResource服务声明:

(function() {
    "use strict";

    angular
        .module("common.services")
        .factory("userAccountResource"
                 ["$resource",
                  userAccountResource]);

    function userAccountResource($resource) {
        return $resource("/api/accounts/:accountId");
    }

}());

最后,这是我的AdminUserAccountsCtrl控制器声明 - 使用它导致错误:

(function() {
    "use strict";

    angular
        .module("rpms")
        .controller("AdminUserAccountsCtrl",
                    ["userAccountResource",
                     adminUserAccountsCtrl]);

    function adminUserAccountsCtrl(userAccountResource) {
        var vm = this;

        userAccountResource.query(function(data) {
            vm.userAccounts = data;
        });
    }

}());

我知道userAccountResource是在common.services模块下创建的,但common.services模块是作为rpms模块的依赖项包含的。为什么它被认为是未知的提供者?

感谢。

1 个答案:

答案 0 :(得分:1)

尝试在,之后添加"userAccountResource"

 .factory("userAccountResource",  //, here was missing
             ["$resource",
              userAccountResource]);