0

我对 Angular 2 很陌生,对 RxJS 或 observables 的性质知之甚少。但是,我正在尝试实现某些功能,并且只是在寻找正确信息的指南,我应该学习以实现这一目标和更全面的知识。

我正在开发一个基本的 Web 应用程序,它更像是一个测试,其中我的几个 Angular 2 路由视图需要从我在 Node.js 中构建的 REST API 端点异步获取数据。

这是我想要实现的目标:

当我(使用 Angular)路由到site.com/messages那里时,将会有一个视图,其组件将使用通过父组件的 providers 数组拉入的服务。我需要这项服务来不断地从 API 端点获取数据site.com/api/messages

在我看来,最直观的方法是让需要数据的组件在组件初始化时打开(http.get()生命周期挂钩)。这将反复轮询我需要的端点,以便它获取视图的数据,该视图可以使用结构指令来迭代它或类似的东西。setInterval()ngOnInit

这个问题是我觉得这是处理获取数据的一种非常原始的方式。我想使用最新、最有效和最有效的方法来做到这一点。不幸的是,我对 Angular 2 很陌生,对它背后的一些技术和实践不是很熟悉。我听说过并看过 RxJS 可观察对象、Angular 变化检测、RxJS 可观察流,我想知道学习这些的最佳方法是什么,以及他们究竟会给我带来什么,就使用 Angular 2 服务获取异步数据而言。任何关于如何利用这些技术以及它们如何组合在一起的信息都会很棒。谢谢

4

1 回答 1

1

您应该使用 Observable 类的间隔方法。例如:

constructor() {
  initializePolling().subscribe(
    (data) => {
      this.dataToDisplay = data;
    }
  );
}

initializePolling() {
  return Observable
     .interval(60000)
     .flatMap(() => this.getNewMessages());
}

然后,您可以直接在组件模板中使用 dataToDisplay。

您还可以利用异步管道来显示可观察的:

constructor() {
  this.dataToDisplay = initializePolling();
}

例如在模板中:

<div *ngFor="d of dataToDisplay | async">{{d.someProperty}}</div>
于 2016-03-01T06:39:28.160 回答