首頁 >web前端 >js教程 >如何在 AngularJS 服務中正確處理非同步 $http 回應?

如何在 AngularJS 服務中正確處理非同步 $http 回應?

Mary-Kate Olsen
Mary-Kate Olsen原創
2024-12-07 17:59:12837瀏覽

How to Properly Handle Asynchronous $http Responses in AngularJS Services?

在服務中處理$http 回應

在您最近的問題中,您遇到了一個問題,即成功處理$http 後視圖沒有更新http請求在你的

解決方案:

要解決此問題,您需要直接使用 Promise 及其“then”函數來處理非同步返回的回應。這是一個範例:

app.factory('myService', function ($http) {
  var myService = {
    async: function () {
      // $http returns a promise
      var promise = $http.get('test.json').then(function (response) {
        // Process the response and return modified data
        return response.data;
      });
      // Return the promise
      return promise;
    }
  };
  return myService;
});

app.controller('MainCtrl', function (myService, $scope) {
  // Call the async method and then do stuff with what is returned in the "then" function
  myService.async().then(function (data) {
    $scope.data = data;
  });
});

在此範例中,服務中的非同步方法傳回一個承諾。控制器呼叫此方法並使用“then”函數處理 Promise 的解析值。這允許您存取和操作回應資料並從控制器更新視圖。

您也可以使用相同的技術快取 $http 請求:

app.factory('myService', function ($http) {
  var promise;
  var myService = {
    async: function () {
      // If the promise doesn't exist, create it
      if (!promise) {
        promise = $http.get('test.json').then(function (response) {
          // Process the response and return modified data
          return response.data;
        });
      }
      // Return the cached promise
      return promise;
    }
  };
  return myService;
});

這種方法確保$http 請求僅發出一次,從而提高了效能。

以上是如何在 AngularJS 服務中正確處理非同步 $http 回應?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn