如何在Angular 4中推送到Observable of Array？ RxJS

Question

我的服務類上有一個屬性，如下所示：

articles: Observable<Article[]>;

它由getArticles（）函數填充，使用標准的http.get().map()解決方案。

如何手動將新文章推送到此數組中; 一個還沒有堅持，所以不是http的一部分？

我的方案是，你創建一個新文章，在保存之前我希望Article []數組將這個新文章推送到它，以便它顯示在我的文章列表中。

此外，此服務在兩個組件之間共享，如果組件A使用ng OnInit()消耗服務並將結果綁定到重復節*ngFor ， 則將從組件B更新服務數組，同時更新組件A的ngFor節中的結果？ 或者我必須手動更新視圖嗎？

非常感謝，西蒙

Answer 1

正如你在評論中所說，我會使用一個主題。

保持articles可觀察而不是存儲為數組的優點是http需要時間，因此您可以訂閱並等待結果。 此外，兩個組件都可以獲得任

 // Mock http const http = { get: (url) => Rx.Observable.of(['article1', 'article2']) } const articles = new Rx.Subject(); const fetch = () => { return http.get('myUrl').map(x => x).do(data => articles.next(data)) } const add = (article) => { articles.take(1).subscribe(current => { current.push(article); articles.next(current); }) } // Subscribe to articles.subscribe(console.log) // Action fetch().subscribe( add('article3') ) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.2/Rx.js"></script> 

Answer 2

您可能只想存儲文章數組，而不是存儲整個observable

articles: Article[]

fetch() {
    this.get(url).map(...).subscribe(articles => this.articles)
}

然后，您可以使用標准數組操作方法操作articles列表。

如果你存儲了observable，它會在你每次訂閱時重新運行http調用（或使用| async渲染它），這絕對不是你想要的。

但是為了完整起見：如果你想要添加項目的數組的Observable，你可以使用它上面的map運算符向它添加一個指定的項目，例如

observable.map(previousArray => previousArray.concat(itemtToBeAdded))

Answer 3

來自有角度的4本書

Subject<Array<String>> example =  new Subject<Array<String>>();


push(newvalue:String):void
{
  example.next((currentarray:String[]) : String[] => {
    return  currentarray.concat(newValue);
   })

}

下面在example.next中說的是將當前數組值存儲在observable中並在其上連接一個新值並向訂閱者發出新的數組值。 它是一個lambda表達式。我認為這只適用於subject observables，因為它們保存在方法subject.getValue（）中存儲的最后一個值。