AngularJS: возврат конфигурации с завода

Позвольте мне начать с того, что я полный новичок в Angular.

Я пытаюсь установить псевдоконстанту в своем приложении Angular, чтобы получить некоторые сведения о конфигурации API из файла $http.get(). Я читал, что правильный способ сделать это — создать фабрику, которая возвращает обещание (source), а затем внедрить эту фабрику в контроллер(ы).

Я считаю, что сделал это правильно, однако я все еще получаю следующую ошибку (обратите внимание, что когда я удаляю ссылки на apiConfig в контроллере, ошибки исчезают):

 Error: [ng:areq] http://errors.angularjs.org/1.3.10/ng/areq?p0=fn&p1=not%20aNaNunction%2C%20got%string
    at Error (native)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:6:417
    at Qb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:19:417)
    at sb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:20:1)
    at Vb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:34:283)
    at Object.e [as invoke] (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:36:439)
    at Object.$get (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:35:71)
    at Object.e [as invoke] (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:37:96)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:38:410
    at d (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js:36:308)

Вот мой код:

Фабрика

app.factory('apiConfig', ['$http', 'API_KEY'], function ($http, API_KEY) {
    return $http.get('http://api.themoviedb.org/3/configuration?api_key=' + API_KEY);
});

Контроллер

appControllers.controller("MovieDetailCtrl", ['$scope', '$routeParams', '$http', 'API_KEY', 'apiConfig', function ($scope, $routeParams, $http, api_key, apiConfig) {
    "use strict";

    apiConfig.then(function (response) {
        $scope.apiConfig = response.data;
    });

    var setMovieObject = function (response) {
        $scope.movie = response.data;
    };

    $http.get('http://api.themoviedb.org/3/movie/' + $routeParams.movieId + '?api_key=' + api_key).then(setMovieObject);

}]);

Я также пытался заставить фабрику вернуть объект, но это тоже не сработало. Вот код, который я пробовал для этого:

Фабрика

app.factory('apiConfig', ['$http', 'API_KEY'], function ($http, API_KEY) {

    var theConfig = {};

    theConfig.getConfig = function () {
        return $http.get('http://api.themoviedb.org/3/configuration?api_key=' + API_KEY);
    };

    return theConfig;
});

Контроллер

appControllers.controller("MovieDetailCtrl", ['$scope', '$routeParams', '$http', 'API_KEY', 'apiConfig', function ($scope, $routeParams, $http, api_key, apiConfig) {
    "use strict";

    apiConfig.getConfig().then(function (response) {
        $scope.apiConfig = response.data;
    });

    var setMovieObject = function (response) {
        $scope.movie = response.data;
    };

    $http.get('http://api.themoviedb.org/3/movie/' + $routeParams.movieId + '?api_key=' + api_key).then(setMovieObject);

}]);

Кроме того, в качестве дополнения, есть ли какие-либо ресурсы для чтения трассировки стека AngularJS? Или есть лучший способ отлаживать приложения AngularJS? Ошибки, которые я вижу в консоли, на самом деле не имеют особого смысла.


javascript angularjs angularjs-factory
person Joel Kinzel    schedule 28.01.2015    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Для отладки используйте батаранг. Это НАСТОЯЩИЙ способ отладки приложений AngularJS :)

Вот несколько советов:

  • Используйте .then для промисов типа $q только тогда, когда вы хотите дополнительно преобразовать значение.
  • Используйте .failure и .success для $http-Promises. Оба имеют одинаковую подпись: (данные, httpStatus); Возможно, ошибка, которую вы получаете, связана с какой-то ошибкой, которая может быть не на стороне клиента (в этом отношении вам может быть отказано в доступе к API).

Сначала проверьте их и используйте Бэтаранг. Также: Какие ошибки вы получаете? На что указывает AngularJS Stacktrace?

person Danny Nophut    schedule 28.01.2015
comment
Я обновил свой исходный пост с ошибкой и некоторыми дополнительными деталями. Я установил Batarang, но он не дает ничего полезного (видимо, более старая версия была более полезной, чем эта текущая версия). - person Joel Kinzel; 28.01.2015

arrow_upward
0
arrow_downward

Нашел проблему. Это была неправильно поставленная квадратная скобка. Изначально у меня было:

Заводская(сломанная)

app.factory('apiConfig', ['$http', 'API_KEY'], function ($http, API_KEY) {
    return $http.get('http://api.themoviedb.org/3/configuration?api_key=' + API_KEY;
});

Проблема заключалась в том, что я преждевременно закрыл массив, прежде чем передать Angular фактическую фабричную функцию. Первая/третья строки кода должны были быть такими:

Заводская (фиксированная)

app.factory('apiConfig', ['$http', 'API_KEY', function ($http, API_KEY) {
    return $http.get('http://api.themoviedb.org/3/configuration?api_key=' + API_KEY;
}]);
person Joel Kinzel    schedule 28.01.2015