使用來自Observable Angular 2的數據

首先，我要感謝像我一樣的支持學習者在使用新技術時獲得的社區。我一直在使用Angular一段時間，還有一些我還是不太明白，也沒有看到其他地方問過。使用來自Observable Angular 2的數據

假設我有一個服務使用我需要的數據返回Observable，應該如何在性能方面正確使用這些數據？

我知道我可以使用異步管道和避免分/混蛋，但這只是在模板發生。如果我需要在組件中使用相同的數據會怎樣？不會再次訂閱（從具有異步管道的模板和具有.subscribe（）的組件）？
我該如何保持可觀察的最新？例如，我有一個表格顯示來自API的數據。如果我點擊第二頁（分頁），我想再打一個電話並更新觀察值。

對不起，如果這之前已經問過，我個人無法找到如果在Stackoverflow上。感謝您的關注！

來源

2017-04-03 anazard

這就是爲什麼Observable的操作符是：組合觀察對象... – n00dl3

嗨，謝謝你的回覆。有沒有可以爲這些情況提供的例子？ – anazard

我正在處理它，請耐心等待... – n00dl3

如果您還需要組件中的數據，那麼您可以訂閱它。但也許你不應該（見下文）...
它的存在，您使用的運營商，可以結合觀測，來定義數據流：

foo$: Observable <Foo[]> ; 
randomClickEvent = new Subject <clickEvent>(); 

ngOnInit() { 
    let initialFetch = this.fooService.getData().share() 
    this.foo$ = Observable.merge(
     initialFetch, // need the initial data 
     initialFetch.flatMap(foos => { 
     this.randomClickEvent.switchMap(() => { //listen to click events 
      return this.fooService.getMore().map((moreFoos: Foo[]) => { //load more foos 
      return foos.concat(...moreFoos) //initial foos values + new ones 
      }) 
     }) 
     }) 
    ); 
    }

<span *ngFor="let foo of (foo$|async)">{{foo.name}}</span> 
<button (click)="randomClickEvent.next($event)">Load More foos !</button>

大多數人只是使用簡單的運營商，如map(),do()等，並管理他們的訂閱勢在必行，但它通常是更好的不訂閱，所以你避免許多副作用和一些「我忘了退訂這裏」。通常你可以在不訂閱的情況下做你需要的一切。

存在可觀測量來描述數據流，僅此而已，沒有什麼不足。這是一個函數式編程的範例：你不定義事情是如何完成的，但它們是什麼。這裏，this.foo$是可能發生的初始fooService.getData()和每個fooService.fetchMore()的組合。

來源

2017-04-03 14:24:19 n00dl3

非常有趣...我認爲再次訂閱Observable會是一種浪費資源，但看起來這是要走的路... 我會嘗試這種方法來重新獲取值。非常感謝您的回覆！ – anazard

使用來自Observable Angular 2的數據

回答

相關問題