Node.js + Angular 2 RxJS Observables 和变更检测 - 利用 Ajax REST 服务的最佳方式 API?
Node.js + Angular 2 RxJS Observabes & Change Detection - Best way to utilize Ajax Service with REST API?
我是 Angular 2 的新手,对 RxJS 或可观察对象的性质知之甚少。然而,我正在努力实现某种功能,我只是在寻找正确信息的指南,我应该学习以实现这一目标并获得更全面的知识。
我正在开发一个基本的 Web 应用程序,它比任何东西都更像是一个测试,其中我的几个 Angular 2 路由视图需要从 REST API 端点异步获取数据我内置了 Node.js.
这是我想要实现的目标:
当我(使用 Angular)路由到 site.com/messages
时,将出现一个视图,其组件将使用通过父组件的提供程序数组引入的服务。我需要此服务不断从 API 端点 site.com/api/messages
.
获取数据
在我看来,最直观的方法是让需要数据的组件在初始化组件时在 setInterval()
上设置 http.get()
(ngOnInit
生命周期钩子)。这将重复轮询我需要的端点,以便它获取视图的数据,该视图可以使用结构指令迭代它或类似的东西。
问题是我觉得这是处理获取数据的一种非常原始的方式。我想使用最新、最有效和高效的方式来做到这一点。不幸的是,我是 Angular 2 的新手,对它背后的一些技术和实践不是很熟悉。我听说过并看到过 RxJS 可观察对象、Angular 变化检测、RxJS 可观察流,我想知道学习这些的最佳方法是什么,以及在使用 [=32= 获取异步数据方面,它们到底能给我带来什么] 2服务。任何关于如何利用这些技术以及它们如何组合在一起的信息都会很棒。谢谢
您应该使用 Observable 的间隔方法 class。例如:
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>
我是 Angular 2 的新手,对 RxJS 或可观察对象的性质知之甚少。然而,我正在努力实现某种功能,我只是在寻找正确信息的指南,我应该学习以实现这一目标并获得更全面的知识。
我正在开发一个基本的 Web 应用程序,它比任何东西都更像是一个测试,其中我的几个 Angular 2 路由视图需要从 REST API 端点异步获取数据我内置了 Node.js.
这是我想要实现的目标:
当我(使用 Angular)路由到 site.com/messages
时,将出现一个视图,其组件将使用通过父组件的提供程序数组引入的服务。我需要此服务不断从 API 端点 site.com/api/messages
.
在我看来,最直观的方法是让需要数据的组件在初始化组件时在 setInterval()
上设置 http.get()
(ngOnInit
生命周期钩子)。这将重复轮询我需要的端点,以便它获取视图的数据,该视图可以使用结构指令迭代它或类似的东西。
问题是我觉得这是处理获取数据的一种非常原始的方式。我想使用最新、最有效和高效的方式来做到这一点。不幸的是,我是 Angular 2 的新手,对它背后的一些技术和实践不是很熟悉。我听说过并看到过 RxJS 可观察对象、Angular 变化检测、RxJS 可观察流,我想知道学习这些的最佳方法是什么,以及在使用 [=32= 获取异步数据方面,它们到底能给我带来什么] 2服务。任何关于如何利用这些技术以及它们如何组合在一起的信息都会很棒。谢谢
您应该使用 Observable 的间隔方法 class。例如:
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>