Angular 尝试 link 服务控制器时出现问题

Question

我正在尝试使用 Angularjs 开发 Web 应用程序，我可以成功实现 ui-router 框架，并且正确加载了模板和控制器，但是随后，控制器调用一个服务，当我遇到一个我无法摆脱的错误时，它就在那里 (https: //docs.angularjs.org/error/$injector/unpr?p0=HomeServiceProvider%20%3C-%20HomeService%20%3C-%20HomeController)。我按以下顺序导入 js 文件：

1-服务 2控制器 3-主要应用程序

这里还有一个 image（代码是在点击状态之后）和 html 代码。 js文件如下：

首页-app.js

'use strict';

angular.module("home", ['ui.router', 'home.controllers'])

    .config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider){

        $stateProvider
                .state('introduccion', {
                    url : "/",
                    templateUrl : "resources/js/home/views/introduccion.html",
                    controller : "HomeController"
                })
}]);

首页-service.js

'use strict';

angular.module('home.services',['ngResource'])

    .factory('HomeService', ['$http', '$q', function($http, $q){

        return {

            prueba: function() {
                return $http.get('http://localhost:8081/home/prueba').then(

                    function(response){
                        return response.data;
                    }, 

                    function(errResponse){
                        console.error('Error while prueba');
                        return $q.reject(errResponse);
                    }
                );
            }
        };
    }]);

首页-controller.js

'use strict';

angular.module("home.controllers", [])

    .controller('HomeController', ['$scope', 'HomeService', function($scope, HomeService) {
              var self = this;
              self.text = null;

              self.prueba = function(){
                  HomeService.prueba().then(



                   function(data) {
                        self.text = data;
                   },

                   function(errResponse){
                        console.error('Error while Prueba');
                   }
              );
          };
}]);

欢迎大家的帮助！！！谢谢

EDIT 我按照建议更改了通过 home.service 的家庭应用程序，我也尝试将它放在家庭控制器上，但在这两种情况下我我得到同样的错误：由于以下原因无法实例化模块主页：

Error: [$injector:modulerr] http://errors.angularjs.org/1.5.5/$injector/modulerr?p0=h...)
at Error (native)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:6:412
at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:40:134
at q (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:7:355)
at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:39:222)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:39:391
at q (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:7:355)
at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:39:222)
at bb (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:43:246)
at c (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js:21:19

Error message

我还创建了一个 jsfiddle：https://jsfiddle.net/txominsirera/0s2d2zyr/

编辑我发现了一些有趣的东西，我用虚拟服务替换了服务 js，没有 ngResource 依赖，而且我没有错误！！

Answer 1

在首页-app.js添加模块home.services喜欢：

    angular.module("home", ['ui.router','home.controllers','home.services'])

而不是：

angular.module("home", ['ui.router', 'home.controllers'])

Answer 2

您需要在您的应用程序中下载 angular-resource 文件以将 ngResource 作为依赖项注入 home.services 模块。在angularfactory/service中需要使用$resource作为依赖。正如我所看到的，您没有在 home.services 模块中使用 $resource，您可以删除 ngResource 作为您的模块依赖项。

然后，控制器写成angular.module("home.controllers", ['home.services'])。您需要在控制器模块中注入服务模块。

看到这个工作 Plunker

Angular 尝试 link 服务控制器时出现问题

Angular issue when trying to link service to controller

html

javascript

apache-tiles

angularjs