AngularJSとPHPコミュニケーションサービス

Question

は、なぜ、このコードでは - >JSON get with angular and PHP、サービスは空の配列を返すが、私が書く場合：

angular.module('pageModule') 
.factory('pageService', function($http){ 
    var pagesArray = new Array(); 

    return{ 
    pagesArray: pagesArray, 

    load: function(){ 
     $http.get('../angCMS/server/php/page.php') 
     .success(function(res){ 
     pagesArray.push(res); 
     }); 
    } 
    }; 
}); 

コントローラー：

angular.module('pageModule') 
.controller('pageController', ['$scope', 'homeService', 'pageService', function($scope, homeService, pageService){ 

    $scope.pages = pageService.pagesArray; 

    pageService.load(); 

}]); 

をすべてが素晴らしい作品？

Answer 1

なぜあなたは電話を待っていませんか？ $ httpが返ってくるという約束を利用してください。

工場：

// Original 
angular.module('pageModule') 
.factory('pageService', function($http){ 
    var pagesArray = new Array(); 

    return{ 
    pagesArray: pagesArray, 

    load: function(){ 
     $http.get('../angCMS/server/php/page.php') 
     // Success is deprecated use then and catch 
     .success(function(res){ 
     pagesArray.push(res); 
     }); 
    } 
    }; 
}); 

// Changed 
angular.module('pageModule') 
.factory('pageService', function($http){ 
    var pagesArray = new Array(); 

    return{ 
    pagesArray: pagesArray, 

    load: function(){ 
     return $http.get('../angCMS/server/php/page.php') 
     .then(function(res){ 
     pagesArray.push(res); 
     return pagesArray; 
     }); 
    } 
    }; 
}); 

コントローラー：

//Original 
angular.module('pageModule') 
.controller('pageController', ['$scope', 'homeService', 'pageService', function($scope, homeService, pageService){ 

    $scope.pages = pageService.pagesArray; 

    pageService.load(); 

}]); 

//Changed 
angular.module('pageModule') 
.controller('pageController', ['$scope', 'homeService', 'pageService', function($scope, homeService, pageService){ 

    $scope.pages = [] //Initiale state; 

    //Make use of the HTTP promise that is returned in the load 
    pageService.load() 
    .then(function (pages) { 
     $scope.pages = pages; 
    }) 
    .catch(function (error) { 
     //Handle error 
     console.log(error); 
    }); 

}]);