AngularJS カプセル化の詳細な例 $http.post()

この記事では、主に AngularJS $http.post() のカプセル化の例について詳しく紹介します。必要な方は、

AngularJS の $http.post() のカプセル化の例を詳しく参照してください

最近、ionic + AngularJS +cordovaフレームワークを使用してモバイル APP プロジェクトに取り組みました。その過程で多くの問題に遭遇しましたが、その 1 つは Ajax カプセル化の問題でした。

実際、私たちはパッケージングの問題について話し続けました。プロジェクトごとにニーズも異なります。典型的な例を挙げると、私がこのプロジェクトに取り組んでいたとき、最初からパッケージングの問題を考慮していなかったために批判されました。と私 友人がそれを要約したことで批判されました...恥ずかしいですよね。

それでは、カプセル化するかどうかの問題をどのように定義すればよいでしょうか?実際、これはそれほど複雑な問題ではありません。最終的には、プロジェクトの規模がそれほど大きくない場合、プロジェクトの収益をあまり考慮する必要はありません。は非常に低く、大規模なプロジェクトの場合は意味がありません。とはいえ、カプセル化がない場合、潜在的なリスクははるかに高くなるため、初期投資は価値があります。

もちろん、この問題は私のような初心者が明確に説明できるものではありません。今日は、カプセル化を考慮した場合にどのように対処するかをお話します。

angularjs は、Ajax リクエストを処理するために使用されるサービス http を提供します。ここでは、読者が angularjs を知っていることを前提としているので、すぐにトピック、post リクエスト のカプセル化を処理する方法に進みます。まず最初に、すべてのユーザー (プロジェクト チームのメンバー) の個別のニーズ (特別な対応が必要な状況) を除外できるかどうかを判断する必要があります。それができない場合は、インターフェースを開いて投稿リクエストを復元する必要があるため、http.post() を返すアウトレットが必要です。

2 番目のポイントは、成功とエラーの両方の状況において、各ユーザーが応答を受け取ったときに結果をどのように処理するかを考慮する必要があり、処理ロジックへの入り口を提供する必要があります。

上記の 2 つの点に基づいて、サービス (パブリック サービス) を定義し、ユーザーが応答コールバックを定義できるようにする myPost メソッドを提供する必要があるという考えが大まかにあります。自由な処理メソッドを使用するには、独自の post() を与えます。幸いなことに、js は十分に柔軟なので、次のように書くことができます:

service('myHttpService', ['$http', function ($http) {
  var myHttpPost = function (url, data, successFn, errorFn) {
  }
  return {
    myHttp: function (url, data, successFn, errorFn) {
      return myHttpPost(url, data, successFn, errorFn);
  }
  }
}]);

上記のように、このメソッドにより、ユーザーは成功と失敗に対応するコールバックである successFn と errorFn を定義できます。 、ユーザーは他の詳細を気にすることなく、自信を持ってデータ処理ロジックを簡単に事前に作成できます。

さらに、ユーザーがより柔軟な post() を取得できるようにするため、次のように実装します。

var httpPromise = $http.post(url, data, {timeout: 30000});
if (!angular.isDefined(successFn)) {
  return httpPromise;
}

ユーザーが成功コールバックを定義しない場合、このカプセル化層は、あたかも成功コールバックであるかのように扱われます。 Post() がスローされ、呼び出し元によって処理されます。そして、呼び出し元が事前に定義したい場合は、カプセル化でロジックを処理する必要があります:

return httpPromise.then(
    function (response) {
     if (response.status) {
      return successFn(response);
     } else {
      /*其他处理*/
     }
    },
    function (error) {
     if (!angular.isDefined(errorFn)) {
      /*其他处理*/
     } else {
      return errorFn(error);
     }
    },
   function () {
    /*无论何总情况下都应该被执行的逻辑*/
   }
)

このようにして、http.post() のカプセル化は基本的に完了します。 successFn を処理するときに angular.isDefined() を使用してコールバックが呼び出し元によって定義されているかどうかを判断する場合、そうでない場合は呼び出し元に処理権限を渡します。定義されている場合は、私が代わりに処理します。 http メソッドは、promise オブジェクト を返すため、then() メソッドの方が興味深いです。実際には、その応答は、promise.success() を通じて処理できます。 promise.error() はさまざまな応答状態のコールバックを処理しますが、then() を使用すると完全な応答オブジェクトを受け取ることができ、success() と error() は応答オブジェクトを解析して、リーダーがコンソールを介して特定の違いを出力できるため、より優れています。 。 見に来て。

上記は $http.post() の単純なカプセル化ですが、これでほとんどの状況に対応でき、より自由な処理方法を維持できます。これについて話し合った友人に感謝します。このパッケージは非常に価値のあるもので、他の友人にも役立つことを願っています。

以上がAngularJS カプセル化の詳細な例 $http.post()の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。