Search code examples
angulartypescriptangular10

I'm trying to find a way to refresh data after making an edit or delete in angular


1 If there is some functions like notifyDataSetChange() in android studio or some functions like that


Solution

  • First way: I guess you are using mat-table and you can call a refresh method as soon as your edit/delete call is succeeded.

    import { MatTableDataSource } from '@angular/material/table';
    
    //...
    
    dataSource = new MatTableDataSource<MyDataType>();
    
    //...
    
    refresh() {
      this.myService.doSomething().subscribe((data: MyDataType[]) => {
        this.dataSource.data = data;
      }
    } 
    

    Second way: You could use ChangeDetectorRef for refreshing the data.

    import { ChangeDetectorRef } from '@angular/core';
    
    //...
    
    constructor(private changeDetectorRefs: ChangeDetectorRef) { }
    
    //...
    
    refresh() {
      this.myService.doSomething().subscribe((data: MyDataType[]) => {
       this.dataSource.data = data;
       this.changeDetectorRefs.detectChanges();
      }
    }