Angular RXJS 长轮询

Question

我有一个为前端维护商店的后端。每次点击我都会返回完整的商店，其中包括应该呈现的消息数组。

通过在服务中实现的长轮询从后端获取数据。

问题是：DOM 没有持续更新后端的每个 cll，我试图只渲染更新而不是整个数组。

当前植入 POM 随每次点击更新。有办法解决吗？？

我尝试了以下代码：

在我的 html 模板中：

<div *ngFor="let message of messages$ | async">
{{message}}
</div>

在组件ts文件中：

messages$ = storeService.messages;
ngOnInit(){
this.messages$.subscribe();
}

店内服务：


  get messages(): Observable<any> {
    return this._messages.asObservable();
  }
 
  private _messages = new BehaviorSubject<any[]>([]);
 
  messages$ = this._messages.asObservable()

 storeGet$ = this.http.get(EndPoint)
getStore(){
return timer(0, 15000).pipe(
        concatMap(() => storeGet$),
        map(resp => {
 
          this._messages.next(resp['messages'])
        })
      )
}

Answer 1

ngFor let 变量有错误。 “ngFor”应该看起来像这样

<div *ngFor="let message of messages$ | async">
    {{message}}
</div>

Answer 2

你只需要

messages$ = timer(0, 15000).pipe(
  switchMap(_ => this.http.get(EndPoint)),
  map(resp => resp['messages'])
)

Angular RXJS 长轮询

Angular RXJS Long Poll

long-polling

observable

rxjs

behaviorsubject

angular