我正在使用Angular Mat Table填充数据库中的数据,一切正常,但是唯一的问题是,如果数据库中的某些记录已更新,mat table无法更新视图,我必须刷新页面才能查看记录中的更改。我想要使用mat表进行实时更新吗?
以下是我的代码
dataSource: macDataSource;
this.dataSource = new macDataSource(this.MacService);
this.dataSource.loadMacs('', 'asc', 0, 10);
loadMacPage()
{
this.dataSource.loadMacs(this.search_sims.nativeElement.value, this.sort.direction, this.paginator.pageIndex, this.paginator.pageSize);
}
ngAfterViewInit()
{
fromEvent(this.search_sims.nativeElement, 'keyup').pipe(tap(async () => {
this.paginator.pageIndex = 0;
this.loadMacPage();
})).subscribe();
this.sort.sortChange.subscribe(() => this.paginator.pageIndex = 0);
merge(this.sort.sortChange, this.paginator.page).pipe(tap(() => this.loadMacPage())).subscribe();
this.ngx.stop();
}
export class macDataSource extends DataSource<MacModel[]>
{
private macSubject = new BehaviorSubject<MacModel[]>([]);
private loadingSubject = new BehaviorSubject<boolean>(false);
public loading$ = this.loadingSubject.asObservable();
public macLength: any;
public macData: any;
constructor(private macService: MacService) {
super();
}
connect(collectionViewer: CollectionViewer): Observable<any> {
return this.macSubject.asObservable();
}
disconnect(collectionViewer: CollectionViewer): void {
this.macSubject.complete();
this.loadingSubject.complete();
}
loadMacs(filter = '', sortDirection = 'asc', pageIndex = 0, pageSize = 10) {
this.loadingSubject.next(true);
this.macService.getAllmacs(filter, sortDirection, pageIndex, pageSize).pipe(catchError(() => of([])), finalize(() => this.loadingSubject.next(false)))
.subscribe(macs => { this.macSubject.next(macs); this.macLength = macs.length; this.macData = macs; this.loadingSubject.next(macs) });
}
getLength(): String {
return this.macLength;
}
}