Angular2/TypescriptでObservableを独自のデータで更新することはできますか？

Question

私はそのような非同期でngForを有する：

<div *ngFor="let location of googleSearchLocations | async"> 
<div *ngFor="let location of facebookSearchLocations | async"> 

これは私の成分である：

private searchTerms = new Subject<string>(); 
googleSearchLocations: Observable<GoogleLocation[]>; 
facebookSearchLocations: Observable<FacebookLocation[]>; 

ngOnInit(): void { 

    this.googleSearchLocations = this.searchTerms 
            .debounceTime(300) 
            .switchMap(term => term 
             ? this.locationService.getGoogleLocations(term) 
             : Observable.of<GoogleLocation[]>([])); 

    this.facebookSearchLocations = this.searchTerms 
             .debounceTime(300) 
             .switchMap(term => term 
              ? this.locationService.getFacebookLocations(term) 
              : Observable.of<FacebookLocation[]>([])); 
} 

search(term: string): void { 
    this.searchTerms.next(term); 
} 

Iは、入力からの値とsearch方法を使用する両方の配列を移入します。

ある時点で、非同期の場合のようにデータを非表示にする空の配列を割り当てるだけで、divを非表示にしたかったのです。しかし、nullまたは新しいObservableを割り当てると、将来の更新が中断されるため、思ったより複雑に見えます。だから、どういうわけか "次へ"を行う方法や、観測可能なデータを私の場合は空の配列に送る方法がありますか？

私はただsearchTermsにプッシュすることができますが、両方のdivを同時に非表示にして+デバウンス値を使用するため、望ましくありません。

Answer 1

次の操作を行うことができます。あなたはあなたのコードを保持しますが、その中にサブジェクトをマージします。これは次のようになります。

let subject = new Subject(); 

this.googleSearchLocations = this.searchTerms 
           .debounceTime(300) 
           .switchMap(term => term 
            ? this.locationService.getGoogleLocations(term) 
            : Observable.of<GoogleLocation[]>([])) 
           .merge(subject); 

リストをクリアすることがわかっている場合は、あなただけの

subject.next([]); 

これは、オリジナルのSearchTermsストリームを台無しにしないと、次の2つのいずれかのすぐと結果だけをクリアすることができます行うことができます。

2つの異なるテーマ（GoogleとFacebook）を用意して、選択時に別々にクリアすることができます。 http://jsbin.com/pagilab/edit?js,console

これは、最初にエミュレートが発見されている結果と2秒後に空の配列で結果を消去します。同様の例と

Jsbinは、ここで見つけることができます。