Почему моя служба ничего

Question

не возвращаются Я строю приложение с помощью Ионные Framework 7 AngularJS

$ ionic info 

Your system information: 

Cordova CLI: 6.2.0 
Gulp version: CLI version 3.9.1 
Gulp local: 
Ionic Framework Version: 1.2.4 
Ionic CLI Version: 1.7.16 
Ionic App Lib Version: 0.7.3 
OS: Distributor ID: LinuxMint Description: Linux Mint 17.1 Rebecca 
Node Version: v0.12.2 

страница Я строю получить список церковных служб и отображает их в списке мастер-деталь. Так что я положил код $ HTTP в службе в соответствии со следующим кодом:

services.js:

.service('ServicesService', ['$http', '$sce', function($http, $sce){ 

var services = []; 

$http.get('http://demo0194057.mockable.io/services').then(function(response) { 
     services = response.data; 
     window.q = services; //checking value of services var 

}, function(error) { 
    console.error("Error loading Services Endpoint! " + error); 
}); 

return { 
    getAllServices: function() { 
     console.log('from inside return obj ' + services); 
     window.p = services; // checking value of services var 
      return services; 
    } 

} 

}]) 

controller.js:

.controller('servicesCtrl', function($scope, $http, ServicesService, InfoService) { 
$scope.services = []; 

$scope.services = ServicesService.getAllServices(); 
window.r = $scope.services; 

$scope.doRefresh = function() { 
       $http.get('http://demo0194057.mockable.io/services').success(function(response) { 
       $scope.services = response; 
      }) 
      .finally(function() { 
       // stop the ion-refresher from spinning 
       $scope.$broadcast('scroll.refreshComplete'); 
      }); 
      } 


}) 

Так что моя проблема заключается в том что служба возвращает пустой массив вместо массива объектов из API JSON REST. Я помещаю в код некоторые отладочные переменные, и я вижу, что из контроллера служба возвращает пустой массив (var window.r). Изнутри службы window.p также пуст, однако window.q имеет правильные данные объекта, что означает, что вызов API работает нормально. Я не могу понять, где эти данные теряются, так что они не будут успешно возвращены из службы.

Пожалуйста, помогите

Answer 1

попробовать так:

Сервис

.service('ServicesService', ['$http', '$sce', function($http, $sce){ 
    var services = []; 

    return { 
     getAllServices: function() { 
      return $http.get('http://demo0194057.mockable.io/services').then(function(response) { 
        services = response.data; 
        return services; 
      }, function(error) { 
       console.error("Error loading Services Endpoint! " + error); 
      }); 
     } 

    } 
}]); 

Контроллер

.controller('servicesCtrl', function($scope, $http, ServicesService, InfoService) { 
    $scope.services = []; 
    $scope.doRefresh = function() { 
     ServicesService.getAllServices().then(function (response) { 
      $scope.services = response; 
     }); 
    }); 
}); 

Answer 2

В вашей службе вам нужно сделать запрос $http.get внутри тела getAllServices метода. В противном случае предложение get then then будет выполнено после вызова getAllServices контроллером, поэтому переменная services не инициализируется в этой точке.

Answer 3

$http.get('http://demo0194057.mockable.io/services').then(function(response) { 
     services = response.data; 
     window.q = services; //checking value of services var 

}, function(error) { 
    console.error("Error loading Services Endpoint! " + error); 
}); 

Это функция асинхронной. Таким образом, службы = response.data будут выполняться через некоторое время.

$ scope.services = ServicesService.getAllServices(); Это будет вызов сразу после того, как угловой повысится и, вероятно, до ваш асинхронный вызов будет выполнен.

So. Если вы захотите получить свои услуги, вы должны обернуть свой ServiceService.getAllServices(); как обещание, где вы будете ждать свой первый запрос. Но, похоже, есть некоторые проблемы с архитектурой ... Попробуйте немного отодвинуть свой код и переделать его.