I am Using Angular Mat Table to populate the data from database everything is working fine but the only issue is if some record in my database is updated,mat table does not update the view,i have to refresh the page in order to view the changes in the record.I want A real time update using mat table is it possible?
Below Given is my code
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;
}
}
Bruno Farias
9119 silver badges25 bronze badges
asked Aug 2, 2019 at 12:16
Benson OO
5271 gold badge7 silver badges25 bronze badges
-
yes, it's possible ;)AVJT82– AVJT822019年08月02日 12:19:29 +00:00Commented Aug 2, 2019 at 12:19
-
how should i achieve that without using mongo streamsBenson OO– Benson OO2019年08月02日 12:20:02 +00:00Commented Aug 2, 2019 at 12:20
-
You need to show us your code and where you are facing an issue. No one can help otherwise.AVJT82– AVJT822019年08月02日 12:20:43 +00:00Commented Aug 2, 2019 at 12:20
-
How does your table get the data from the database?LeBavarois– LeBavarois2019年08月02日 12:21:50 +00:00Commented Aug 2, 2019 at 12:21
-
@AJT_82 i have my code in the questionBenson OO– Benson OO2019年08月02日 12:30:17 +00:00Commented Aug 2, 2019 at 12:30
lang-js