在Angular中创建数据流

时间:2018-01-02 00:09:58

标签: angular rxjs observable angular2-observables data-stream

我有一个使用Observable从数据库中获取数据的服务。它似乎只获取一次数据。当用户将数据添加到数据库然后流式传输到Angular时,我会倾听它。

获取所有数据的服务

getAllProj(): Observable<NouveauProjet[]> {
  return this.http.get<NouveauProjet[]>(
    "http://127.0.0.1:8081/api/proj/projets"
  );
}

添加数据的服务

addProj(nouveauProjet: NouveauProjet): Observable<any> {
  return this.http.post<NouveauProjet[]>(
    "http://127.0.0.1:8081/api/proj/projets",
    nouveauProjet
  );
}

当我使用我的服务时,我只订阅了它们

getAllProj() {
  this.ajoutProj.getAllProj().subscribe(
    response => {
      console.log("hello"+response);
      this.nouveauProjet=response;
    },
    error => console.log(error)
);

我认为Observable在向数据库添加新数据时仍然会监听服务器但事实并非如此,那么如何将我的observable转换为数据流。

2 个答案:

答案 0 :(得分:2)

简短回答是Websockets。这实际上是服务器方面的问题。

当数据库更新时,您的API永远不会“推送”数据,除非您已经告诉它这样做,并且最简单的方法是使用Websockets。我将提供一个示例实现,但是有很多变量,特别是如果您正在监视数据库更新并相应地推送信息。

Observable是一个数据流。如果您在服务中为同一API调用设置多个订阅,则从API中提取新数据时,每个订阅都将获得新值。问题是HTTP请求只是源自客户端的“请求”。

答案 1 :(得分:0)

以下是一些如何手动创建数据流的示例,因此您可以在最后测试您的代码是否正常工作。

let arr = [];
setInterval(() => arr.push((Math.random())), 1001);
return interval(2000).pipe(map(i => arr));

如果解决方案不是你所期望的,那么就把它留给像我这样正在学习 rxjs 的初学者,以便他们提高他们的 rxjs 技能。