Использовать выходные данные сервисов для контроллеров

Question

Я хочу, чтобы мой $http.get перешел из моего сервиса на мой контроллер.

myserviceSample.js

  function messagesService($q,$http){
    var messages;
    $http({
      method: 'GET',
      url: 'http://api.com/feedback/list'
    })
    .then(function success(response){

      messages = response.data;
      console.log(messages);
    },function error(response){
      console.log('error'+ response);
    });
    console.log(messages);

    return {
      loadAllItems : function() {
        return $q.when(messages);
      }
    };
  }

})();

mycontrollerSample.js

  function MessagesController(messagesService) {
    var vm = this;

    vm.messages = [];

    messagesService
      .loadAllItems()
      .then(function(messages) {
        console.log(messages);
        vm.messages = [].concat(messages);
      });
  } 
})();

Приведенные выше результаты кода дают неопределенный вывод. Что я скучаю?

Answer 1

$q.when объект ожидает promise/object чтобы это работало. В вашем случае вы должны пройти promise Возражать $q.when как вы делаете $http.get вызов. Вот messages объект не обещает $http.get, так что вы можете изменить реализацию метода, как показано ниже.

обслуживание

function messagesService($q,$http){
    var messages = $http({
      method: 'GET',
      url: 'http://api.com/feedback/list'
    })
    .then(function success(response){
       return response.data;
    },function error(response){
       return $q.reject('Error Occured.');
    });

    return {
      loadAllItems : function() {
        return $q.when(messages);
      }
    };
}

Затем контроллер разрешит это обещание и .then сделает свое дело

function MessagesController(messagesService) {
    var vm = this;
    vm.messages = [];
    messagesService
      .loadAllItems()
      .then(function(messages) {
        console.log(messages);
        vm.messages = [].concat(messages);
      });
} 

Примечание: использование $q создать пользовательское обещание, считается плохим шаблоном, когда у вас есть $http.get метод там (который возвращает само обещание)

Улучшенная реализация

function messagesService($q, $http) {
  var messages, getList = function() {
    return $http({
      method: 'GET',
      url: 'http://api.com/feedback/list'
    })
    .then(function success(response) {
      messages = response.data
      return response.data;
    }, function error(response) {
      return $q.reject('Error Occured.');
    });
  };

  return {
    loadAllItems: function() {
      if (!data)
        return getList(); //return promise
      else
        return $q.resolve(messages); //return data
    }
  };
};