Ожидание, пока $ resource не закончит загрузку в моем контроллере, прежде чем продолжить

Question

Я создаю rest api с fosrestbundle, и я управляю интерфейсом с угловым шаблоном Twig. Один на моем адресном выглядит следующим образом:

http://mywebsite/myroute/idContain 

Когда я загружаю URL в браузере, в шаблоне прута (рода HTML), я получить параметр «idContain» (, поступающий от fosrestbundle контроллера) с нг-INIT из angularjs так:

<div class="container-fluid" ng-init="getContainByID({{ idContain }})"> 
    //...lot html div with angularjs directives 
</div> 

И немедленно, нг-INIT будет идти к моему angularJS приложение находит getContainByID (idContain), чтобы запустить его. Это один выглядит следующим образом:

angular.module("myApp", ["ngSanitize", 'angular.filter', 'ui.tinymce', ...]) 
.config(function($interpolateProvider, ...) { 
    $interpolateProvider.startSymbol('{[{').endSymbol('}]}'); 
}) 
    .controller("myCtrl",function ($filter,..., myService) 
{ 
    // lot of code... 
    $scope.getContainByID = function(idContain) 
    { 

     $scope.currentContain = myService.getContains(idContain); 
     $scope.containRoot = $scope.currentContain.contain.containRoot; 
     ... 

    } 
    // lot of code... 
} 

Дело в том, что, myService.getContains(idContain) приходят из службы отдыха, глядя, как это:

angular.module("MyServiceRest", ['ngResource']) 

.factory("myService", function ($rootScope, $resource) { 


    var apiData = $resource(
     "/api", {}, 
     { 
      ... 
      "getContains": {method: 'GET', isArray: false, url: "mywebsite/api/myroute/:containid"} 
      ... 
     }); 

    return { 

     getContains: function (idContain) { 
      return apiData.getContains({containid: idContain}); 
     } 

    } 
}); 

Теперь проблема, когда я запускаю мой angularjs App, $ сфера .containRoot не дожидается до тех пор, пока myService.getContains (idContain) (исходящий из моей службы asynchroeous $ resource) не закончит загрузку и не приведет к ошибкам, приводящим к сбою в работе webapp.

Как это сделать, чтобы заставить $ scope.containRoot и остальную часть моего углового кода ждать до тех пор, пока myService.getContains(idContain) (связанный с ресурсом api) полностью не завершит загрузку до продолжения?

Answer 1

$resource выполняет асинхронный запрос, но немедленно возвращает пустой объект или массив.

Существует множество способов решения вашей проблемы.

Нельзя не беспокоиться о объявлении $scope.containRoot и просто использовать currentContain.contain.containRoot на вид. Это свойство будет получить оказанное после получения запроса

Другого способа заключается в использовании $ обещания, что также возвращенное $resource и присвоить свойство области действия в обещании обратного вызова

$scope.currentContain = myService.getContains(idContain); 

$scope.currentContain.$promise.then(function(){ 
     $scope.containRoot = $scope.currentContain.contain.containRoot; 
}); 

Другим способ заключается в использовании решительности маршрутизации на основе по тому же обещанию, что маршрут (или состояние в зависимости от маршрутизатора) вводится noot до тех пор, пока запрос не будет завершен