AngularJs で q all を使用する
AngularJs での promise と AngularJs での $q.all とは何かを紹介します。
AngularJs の promise は何ですか
一連の非同期関数に対して HTTP リクエストを行うと、ネットワーク障害が発生する可能性があるため、callback と errorCallback を使用する必要があります。長い関数または複数の関数がある場合、コードを乱雑にするために、複数の callback および errorCallback を使用する必要がある場合があります。
Promise は、コードを台無しにすることなく、非同期関数を直列に実行するのに役立ちます。約束は組み込みサービス $q によって提供されます。
AngularJs で $q.all とその使い方は
$q.all の名前が示すように、複数のプロミスを組み合わせて、すべてが解決されたときに解決される単一のプロミスにします。
$q.all の使用方法を理解するための例を見てみましょう。2つの変数 pR45 と pR55 を作成しましょう。
# angularjs
angular.module("app",[])
.run(function($q) {
var pR45 = $q.when(45);
var pR55 = $q.when(55);
});
});
次に、$q.all を使用して、コンソールの変数の値をログに記録しましょう。
# angularjs
angular.module("app",[])
.run(function($q) {
var pR45 = $q.when(45);
var pR55 = $q.when(55);
$q.all([pR45,pR55]).then(function([r45,r55]) {
console.log(r45);
console.log(r55);
});
});
上記のコードでは、$q.all は彼に渡すすべての変数を受け取り、それらがすべて解決されると、これらの変数の結果を新しい変数 r45 と r55 に格納します。次に、上記のコードに示すように、これらの結果を関数で使用できます。
<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app="app"></body>
上記の HTML コードと AngularJS スクリプトを実行すると、次の出力が得られます。
$q.all 関数を使用して、これらの簡単な手順で非同期関数を実行できます。
Rana is a computer science graduate passionate about helping people to build and diagnose scalable web application problems and problems developers face across the full-stack.
LinkedIn