Angular2：ループ中のHttpリクエストをキャンセルします。

Question

ガジェットをループして一連のHttp呼び出しを行いました。すべての要求を中止する方法はありcomponent.service.tsあなたの観測から

@Injectable() 
export class UserService { 
    constructor(public _http: Http) { } 
getGadgetsData() { 

     return this._http.get(this._dashboards, { headers: this.getHeaders() }) 
      .map((res: Response) => res.json()); 
    } 

} 

Answer 1

これが必要なのかどうか見てください。

observableList: []; 

...... 

for (let gadget of gadgets) { 
    let obs = this.userService.getGadgetsData(gadget.Id, gadget.Name).subscribe(gadgetsData => { 
    }); 
    this.observableList.push(obs); 
} 

... 
onClick() { 
    for (let i = 0; i < this.observableList.length; i++) { 
     this.observableList[i].unsubscribe(); 
    } 
} 

Answer 2

あなたはあなたの要求のタイムアウトを追加することができ、その後、unsubscribeで

 for (let gadget of gadgets) { 
       this.userService.getGadgetsData(gadget.Id, gadget.Name).subscribe(gadgetsData => { 
    }); 
} 

マイサービスコード。

注：サンプルコードのためにRxJsとObservableを使用していると思います。あなたはクリックイベントをお持ちの場合は

は、すべてのあなたの観測（inside your loop）への参照を保存して、リストに入れ、その後、あなたの関数の内部で（例えばonClick()）すべての観測から、そのリストとunsubscribeを反復処理することができます。 githubのドキュメントから

var myObservable = this.userService.getGadgetsData(gadget.Id, gadget.Name) 
      .subscribe(gadgetsData => {}); 

    //later on your code, maybe on your click event 

    myObservable.unsubscribe(); 

：unsubscribeとsubscribe

徹底的になろうとして：あなたはメイン（親）からの退会時になるよう

は

また、すべての観測可能な、他の観測に観測を追加することができます内に含まれる観察可能なものは、購読を中止します。 Observableオブジェクトに含まれているaddとremoveというメソッドを使用して、これを実現できます。

これを行うにはより良い方法があるかもしれませんが、それは私の頭の上にありません。