AngularJS中的未知资源提供者

debugcn 发表于 Dev

发育

我正在使用也门的脚手架创建一个有角度的应用程序。我希望o从REST服务发送数据并获取数据，但是资源提供程序有问题。

我有一个简单的控制器：

angular.module('fronterApp')
  .controller('ClubCtrl', function ($scope, ClubService) {
    $scope.find = function(){
     $scope.club = ClubService.find();
    };
  });

服务：

var app = angular.module('fronterApp');
app.service('ClubService',  function (ClubResource) {

    var find = function(){
      return ClubResource.find({id: 1});
    };

    return{
      find: find
    };
  });

我的资源提供者：

var app = angular.module('fronterApp', ['ngResource', 'ngRoute']);
var server = 'http://localhost:8080';
app.run(function($http) {
  $http.defaults.headers.common['Content-Type'] = 'application/x-www-form-urlencoded';
  $http.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
});
app.factory('ClubResource',  function($resource) {
  return $resource(server + '/api/clubs/:id', {id: '@id'});
});

现在，我想使用提供程序使用服务在控制器中获取数据。但是在运行应用程序之后，js控制台会说：

Error: [$injector:unpr] Unknown provider: ClubResourceProvider <- ClubResource <- ClubService

我已经添加<script src="bower_components/angular-resource/angular-resource.js"></script>到index.html，试图['ngResource']在服务中使用，但是没有任何效果。此外，如果我添加，['ngResource']在控制台中不会出现此错误，但是不会显示club.html中的html（该html仅显示服务器中的项目）。我的意思是，没有视图加载。我不知道，为什么我的服务无法在此处注入资源提供程序。

更新：现在，我将服务更改为：

angular.module('fronterApp')
  .service('ClubService', function (ClubResource) {

  var get = function () {
    return ClubResource.get({id: 1});
  };

  return {
    get: get
  };
});

和资源（但是GET是默认设置，因此我认为这是不必要的）：

var app = angular.module('fronterApp');
var server = 'http://localhost:8080';
app.run(function ($http) {
  $http.defaults.headers.common['Content-Type'] = 'application/x-www-form-urlencoded';
  $http.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
});
app.factory('ClubResource', function ($resource) {
  return $resource(server + '/api/clubs/:id', {id: '@id'}, {
    get: {
      method: 'GET'
    }
  });
});

发育

好的，我已经解决了这个问题...我很愚蠢，因为我的工厂位于其他文件中，名为routing.js。

var app = angular.module('fronterApp');
var server = 'http://localhost:8080';

app.factory('ClubResource', ['$resource', function ($resource) {
  return $resource(server + '/api/clubs/:id', {id: '@_id'}, {
  });
}]);

而且我没有将此文件添加到index.html中，因此出现此错误是因为Angular无法找到具有所需代码的脚本。现在一切正常。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。