2017-06-14 11 views
0

私はhttp観測可能なデータを取り出すフォームを持っています。データを読み込んで応答を待っている間、私は送信ボタンを無効にしたいと思います。角2 - http - 観測可能 - 開始/停止/実行中の状態

現在、サブスクライブメソッドが呼び出される前にステータスを実行に設定し、応答がある場合は実行中のフラグを無効にするために、各コンポーネント/フォームにステータスコードを実装しました。

問題は、このチェックを各コンポーネント/フォームで実装する必要があることです。私は、要求が行われる前にステータス情報を設定するモデルでオブザーバブルをラップしたいと思います。

最高のものは何ですか?私は、要求が行われる前に関数を追加するための解決策を見出しませんでした。 Observableには以前の機能がありません。私は2つのObservablesを連結することも試みました。最初のものは、2番目のObservableが開始していることを示すためにのみ使用されます。

Observableの開始点を抽象的に聞く簡単な方法がありますか?私は保持するためにHTTPサービスをラップしたいと思います(スタート/ストップ/ランニング/ ...)を述べて...

編集1:ここ

はイムが現在やって何のいくつかの擬似コードです。私はこの状態保持者を、ボタンによってトリガされるすべての観測値に追加しました。私はこの重複したコードを削除したい。

this.mystateHolder.start(); // sets running;error,success to false 
this.myservice.updateSomething(mydata).subscibe(
    ok => mysateHolder.stop(false) // sets success to true and running to false 
    error => mystateHOlder.stop(true, error) // sets error to true and running to false 
) 
<button [disabeld]="mystateHolder.isRunning()"></button> 
<span *ngIf="mystateHolder.hasErrors()">mystateHolder.getErrorMessage()</span> 

ターゲット擬似コード(多分):あなたが行うことができます

const state = this.myservice.updateSomething(mydata).state() 
state.subscribe(); 
console.log(state.hasErrors()) 
console.log(state.isRunning()) 
console.log(state.success()) 

答えて

0

ことの一つは、あなたが希望する状態に行く前に必要な電話をかけることがあります。これは、resolveパラメータで使用するルータ内で行うことができます。 (角度ルータを使用している場合はhttps://angular.io/api/router/Resolve、ui-routerもこれを提供します)。

<button [disable]="data === null">Submit</button> 

やスーツあなたの問題といくつかの他のチェック:私は考えることができる 他の事は、データがそのような[無効]プロパティで、ボタンのタグに使用可能な場合だけチェックすることです。

+0

私の例(編集1)が更新されました。私がデータをチェックすれば、それもまた別の状態チェックです。データが返されない場合はどうなりますか?私は、すべての特定の用途のためにすべての観測で何度も何度もやり直さなければならないが、毎回同じように... – meleagros