Ожидание вызова $ http.get для завершения

Question

Я знаю, что это имеет какое-то отношение к обещаниям, но мне трудно понять, как их реализовать.

Мой контроллер:

angular.module('landingApp') 
    .controller('MainCtrl', function($http, $q){ 
    var main = this; 

    main.favoritesIds = []; 

    $http.get('api/v1/planograms/get_favorites') 
     .success(function(data){ 
     for(var i=0; i < data.planograms.length; i++) 
      main.favoritesIds.push(data.planograms[i].id); 
     }); 

    main.isFavorite = function(planogram_id){ 
     return main.favoriteIds.indexOf(planogram_id) > -1; 
    }; 

тогда в моем шаблоне я использую isFavorite(), как это:

<div class="col-md-6" ng-repeat="planogram in main.planograms"> 
    <i class="fa fa-star fa-2x favorite" ng-class="{'yellow' : main.isFavorite(planogram.id)}"> 

Поэтому в основном я хочу звезда иконки пожелтели для всех планограммы пометку «любимого». Но main.isFavorite() возвращает undefined Я угадываю, потому что метод $ http.get не разрешен. Итак, мой вопрос заключается в том, как реализовать обещания в этой ситуации?

Answer 1

Прежде всего, это не работает, потому что у вас есть опечатка в isFavorite Функция: это не main.favoriteIds, но main.favoritesIds.

Во-вторых, он должен работать независимо от обещаний. Вы правы, что до вызова $httpmain.favoritesIds пуст, но когда он заполнен, массив заполняется, и функция isFavorite (при просмотре с помощью углового) переоценивается.

Хотя ваш код будет работать после того, как опечатка будет исправлена, она не является оптимальной. Наблюдаемые функции вызывают на каждые цикл дайджеста, и должны быть быстрыми, а ваш isFavorite делает isIndexOf, что имеет сложность O (n).

Вместо создания массива favoritesIds создайте объект, чтобы вы могли выполнить поиск O (1). Или, еще лучше, увеличьте массив planograms с любимыми данными.

Например, favoritesIds в качестве объекта:

$http.get('api/v1/planograms/get_favorites') 
    .success(function(data){ 
     for(var i=0; i < data.planograms.length; i++) { 
      main.favoritesIds[data.planograms[i].id] = true; 
     } 
    }); 

main.isFavorite = function(planogram_id){ 
    return main.favoritesIds[planogram_id]; 
};