AngularJS: service not возвращающее значение

Question

Я пытаюсь написать Угловое обслуживание, и кажется, что чего-то не хватает. Моя проблема заключается в его не возвращает значения в мой углового контроллер

getPrepTimes() метод не возвращают данные HTTP

Но когда я проверяю сети (с помощью Chrome Девых инструментов) будет правильно называют внешний апи и возвращающим JSON объект как ответ

#my service 
'use strict'; 
angular.module('recipeapp') 
    .service('prepTimeService',['$http', function($http){ 
     this.prepTime = getPrepTimes(); 

     function getPrepTimes(){ 
      $http({ 
      url: '/prep_times/index.json', 
      method: 'GET' 
      }) 
      .success(function (data, status, header, config){ 
      return data; 
      }); 
     }; 
    } 
    ]); 




#controller 
'use strict'; 

angular.module('recipeapp') 
    .controller('recipeCtrl', ['$scope', 'prepTimeService', function($scope, prepTimeService){ 
    $scope.prep_time = prepTimeService.prepTime; 
    }]); 

Когда я проверил метод getPrepTimes() с возвратом строки она работает. Что здесь можно пропустить?

Answer 1

Пара вещей неправильно с вышеуказанным. Вы назначаете this.prepTime на номер getPrepTimes(). () тут же вызовет getPrepTimes, а не когда вы на самом деле называете это! Кроме того, необходимо использовать обратные вызовы, чтобы получить данные обратно и использовать его:

angular.module('recipeapp').service('prepTimeService',['$http', function($http){ 
    this.prepTime = getPrepTimes; 

    function getPrepTimes(callback) { 
     $http({ 
      url: '/prep_times/index.json', 
      method: 'GET' 
     }).success(function (data, status, header, config){ 
      callback(data); 
     }); 
    }; 
}]); 

И теперь использовать его так:

prepTimeService.prepTime(function(data) { 
    $scope.prep_time = data; 
});  

Answer 2

призывает к $http службам являются асинхронным, что означает, что вы должны вернуть обещание (а не значение):

this.prepTime = function() { 
    return $http({ 
     url: '/prep_times/index.json', 
     method: 'GET' 
    });   
}; 

А на контроллере:

angular.module('recipeapp') 
    .controller('recipeCtrl', ['$scope', 'prepTimeService', function($scope, prepTimeService){ 
    $scope.prep_time = prepTimeService.prepTime() 
     .success(function (data, status, header, config){ 
     $scope.someVar = data; 
     }); 
}]); 

Answer 3

Wrap ответ с обещанием :

var self = this; 

var deferred = $q.defer(); 

self.getPrepTimes = function() { 
     $http({ 
      url: '/prep_times/index.json', 
      method: 'GET' 
     }) 
       .success(function(data, status, headers, config) { 

        if (data.error === undefined) { 
         deferred.resolve(data); 
        } else { 
         if (data.error !== undefined) { 

         } else { 
          deferred.reject(data); 
         } 
        } 

       }).error(function(data, status, headers, config) { 
      deferred.reject(data); 
     }); 
     return deferred.promise; 
    }; 

В контроллере называют это:

prepTimeService.getPrepTimes().then(function(result) { 
    $scope.prep_time = result; 
    }, 
    function(error) { 
    // show alert   
    });