使用可观测角度2的数据

Question

首先，我要感谢社区对我这样的学习人员在使用新技术的过程中所给予的支持。我已经用了一段时间了，有些东西我仍然不太明白，也没有在其他地方看到过。

如果我有一个服务，返回我需要的数据可以观察到的数据，我应该如何正确地使用这些数据，就性能而言？

1. 我知道我可以使用异步管道，并避免不得不进行sub/unsub，但是这种情况只发生在模板中。如果我也需要在组件中使用相同的数据怎么办？不会再次订阅(使用异步管道的模板和使用.subscribe()的组件)吗？
2. 我如何保持可观察的最新情况？例如，我有一个表显示来自API的数据。如果我点击第二页(分页)，我想打另一个电话，并使可观察的更新。

如果之前有人问过这个问题，我很抱歉，我个人无法在Stackoverflow上找到。感谢您的关注！

Answer 1

1. 如果您也需要组件中的数据，您只需订阅它。但是也许你不该(见下文)..。
2. 在那里，您可以使用操作符，可以组合可观测值来定义自定义数据流：

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()等，并且必须管理他们的订阅，但通常情况下最好不要订阅，所以您可以避免许多副作用和一些"Ooops --我忘了在这里取消订阅“。通常你不需要订阅就可以做任何你需要的事情。

可观测值存在来描述数据流，没有更多，也没有更少。这是一个函数式编程的范例:你不定义事情是如何完成的，而是它们是如何完成的。在这里，this.foo$是初始fooService.getData()和可能发生的每个fooService.fetchMore()的组合。