Неизвестный поставщик ресурсов в AngularJS

Question

Я создаю угловое приложение, используя эшафот от 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'], я не получаю эту ошибку в консоли, но не отображается html из club.html (этот html только показать элемент с сервера). Я имею в виду, что никакое представление не загружается. Я не знаю, почему моя служба не может вводить поставщика ресурсов здесь.

UPDATE: Теперь я изменил свою службу:

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' 
    } 
    }); 
}); 

Answer 1

Ok , Я уже решил эту проблему ... Я глуп, потому что у меня есть завод в другом файле, названный 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 не смог найти скрипт с необходимым кодом. Теперь все работает нормально.