angularjs和$ http請求

Question

你好我是AngularJs的新手，並試圖從我的服務器獲取json數據。當服務得到執行時，我在提琴手中看到了明確的迴應。但是成功或錯誤函數沒有得到執行，所以服務返回一個空數組。

var app = angular.module('imageApp', []); 

app.service('imageService', function ($http) { 
    var imageModels = []; 
    this.Images = function (url) { 
     $http({ method: 'GET', url: url }).success(function (data) { 
      imageModels = data; 
     }).error(function (data) { 
      imageModels = data || "Request failed"; 
     }); 

     return imageModels; 
     }; 
    }; 
}); 

app.controller('ImageController', function (imageService, $scope) { 
    $scope.fetch = function (url) { 

     $scope.url = url; 
     $scope.ImageModels = imageService.Images($scope.url); 
    }; 
}); 

Answer 1

$ http以異步方式返回結果。因此，return imageModels將在success（）或error（）回調有機會運行之前執行。你需要等待$ http創建解決的承諾 - 在你的控制器中使用then（）。

不是這裏就不重複了，看到@Pete BD解決方案：https://stackoverflow.com/a/12513509/215945

Answer 2

更新您的服務是這樣的。

app.service('imageService', function ($http, $q) { 
    this.Images = function (url) { 
     return $http({ method: 'GET', url: url }).success(function (data) { 
      $q.resolve(data); 
     }).error(function (data) { 
      $q.reject(data || "Request failed"); 
     }); 
    }; 
}); 

然後你的控制器，你現在可以等待承諾從服務返回。

imageService.Images($scope.url) 
    .then(function(response){ 
     // success 
    }).catch(function(error){ 
     // error 
    }) 

那麼發生了什麼？在您的服務中，請注意，我們添加了$q來創建承諾，因此我們可以從的reslove和reject響應並使其在控制器上成爲「可靠」。

編寫服務來處理$ http請求對我來說總是一件麻煩事，所以我創建了這個angular module來爲我處理事情。如果你想要，你可以檢查出來。