[英]Angular8 : Refresh Data Realtime
I have code in app.component, which get all users我在 app.component 中有代码,可以获取所有用户
I am trying to refresh my page every second, because if i have 2 opened windows and make any CRUD actions, second window will show old data, without new developer / etc.我试图每秒刷新我的页面,因为如果我有 2 个打开 windows 并进行任何 CRUD 操作,则第二个 window 将显示旧数据,没有新的开发人员/等。
I am trying to use ngOnDestroy, but it does not work:我正在尝试使用 ngOnDestroy,但它不起作用:
export class AppComponent implements OnInit{
interval = interval(1000); // 1s
ngOnDestroy() {
if (this.interval) {
// @ts-ignore
clearInterval(this.interval);
this.getDevelopers();
}
}
public getDevelopers(): void {
this.developerService.getAllDevelopers().subscribe(
(response: GetByIdDeveloperResponse[]) => {
this.developers = response;
},
(error: HttpErrorResponse) => {
alert(error.message);
}
);
}
}
How looks my service method:我的服务方法看起来如何:
public getAllDevelopers(): Observable<GetByIdDeveloperRequest[]> {
return this.http.get<GetByIdDeveloperResponse[]>(`${this.apiServerUrl}/api/v2/developers`);
}
interval from rxjs is a Observable, and you need to subscribe for attach an event从 rxjs 的间隔是一个 Observable,你需要订阅附加事件
import { interval } from 'rxjs';
export class AppComponent implements OnInit, OnDestroy {
$interval = interval(1000); // 1s
subInterval;
ngOnInit() {
this.subInterval = this.$interval.subscribe(() => this.getDevelopers());
}
ngOnDestroy() {
// destroy subscription
if( this.subInterval ){
this.subInterval.unsubscribe();
}
}
public getDevelopers(): void {
this.developerService.getAllDevelopers().subscribe(
(response: GetByIdDeveloperResponse[]) => {
this.developers = response;
},
(error: HttpErrorResponse) => {
alert(error.message);
}
);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.