AngularJS: Использование завод внутри контроллера

Question

Это моя первая попытка использовать Angularjs и я пытаюсь создать службу и использовать его внутри контроллера:

var appTest = angular.module("appTest", ["ngRoute"]); 
var appTestControllers = angular.module('appTestControllers', []); 

appTest.config(['$routeProvider', '$locationProvider', 
    function($routeProvider, $locationProvider) { 

     $routeProvider. 
      when('/', { 
       templateUrl: 'partials/home.html', 
       controller: 'HomeCtrl' 
      }); 

      $locationProvider.html5Mode(false); 
    } 
]); 

appTest.factory("booksApi", function($http){ 

    var _getBooks = function() { 
     return $http.get('http://localhost/editora-voo/website/books.json'); 
    }; 

    return{ 
     getBooks: _getBooks 
    }; 

}); 


appTest.controller('HomeCtrl', ['$scope', '$http', function($scope, $http, booksApi) { 

    booksApi.getBooks().success(function(data) { 
     $scope.books = data; 
    }); 
}]); 

Но она возвращается сообщение об ошибке: Не удается read property 'getBooks' of undefined

Answer 1

Вы пропустили добавить booksApi depernency внутри вашего массива зависимостей контроллера, вы должны добавить его первым, а затем использовать его внутри функции контроллера.

Контроллер

appTest.controller('HomeCtrl', ['$scope', '$http', 'booksApi', //<--missed dependency here 
    function($scope, $http, booksApi) { 
    booksApi.getBooks().then(function(response) { 
     $scope.books = response.data; 
    }); 
}]); 

Plunkr Here