AngularJS中的未知资源提供程序

时间:2015-07-05 20:18:08

标签: angularjs rest resources

我正在使用Yeomen的脚手架创建一个角度应用程序。我希望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'
    }
  });
});

1 个答案:

答案 0 :(得分:1)

好的,我已经解决了这个问题...... 我很蠢,因为我的工厂在其他文件中,名为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无法找到所需代码的脚本。 现在一切正常。