如何使用 Angular 8 在不同浏览器上的同一网页之间同步数据

Question

我创建了一个 angular 应用程序，我在其中使用正在使用 REST API 的 Angular HttpClient 接收数据，接收到的数据是我必须在只是一个表格的页面。如果我编辑数据并单击保存，数据将通过 HttpClient 保存，并且是对 REST API.

的 put 调用

因为我是 angular 的新手，所以我的问题是如果我在两个不同的浏览器中打开同一个页面并在其中一个浏览器中进行更改，我希望更改后的数据反映在其他浏览器中浏览器也是如此。如何使用 Angular 8 使这成为可能？

调用休息api单独服务写成如下：

getData(): Observable<IData> {
   return this.http.get(`${this.serverurl}`);
}

updateData(data: IData): Observable<IData> {
   return this.http.put<IData>(`${this.serverurl}/save`, data);
}

服务调用如下：

ngOnInit() {
  this.myHttpService.getData().subscribe(
    data => {
      this.myData = Object.assign({}, data);
    }
  );
}

onSaveClick() {
  if (this.myData) {
    this.myHttpService.updateData(this.myData).subscribe(
      response => {
        this.myData = response;
      }
    );
  }
}

我还需要做什么？

Answer 1

我通过使用 Interval(https://rxjs-dev.firebaseapp.com/api/index/function/interval) 并将我的 get 调用置于 interval:

下找到了解决方案

ngOnInit() {
  interval(1000).pipe(
  takeWhile(() => this.alive)).subscribe(() => {
    this.myHttpService.getData().subscribe(
      data => {
        this.myData = Object.assign({}, data);
      }
    );
   });
  }

如何使用 Angular 8 在不同浏览器上的同一网页之间同步数据

How to sync data between same web page on different browsers using Angular 8

typescript

angular

angular-httpclient