I use ngrx to display and update and delete elements in my table that comes from angular material, for that I have a get and add and delete method that works very well but the problem is that every time I delete my table does not update I am forced to refresh my page.

I could very well import the get method into the delete method but I would like to do otherwise.

thanks you.

ts.file

export class AppComponent implements OnInit, OnDestroy {

  public myUserSub!: Subscription;
  private ELEMENT_DATA!: PeriodicElement[];
  public displayedColumns: string[] = ['name'];
  public dataSource = new MatTableDataSource(this.ELEMENT_DATA);

  constructor(private store: Store<reducer.State>) {

    store.select(tableSelector.selectAll).subscribe((t) => {
      this.dataSource.data = t;
    });
  }

  ngOnInit(): void {
    this.storeSelect();
    this.get();
  }

  storeSelect() {
    this.myUserSub = this.store.select(tableSelector.selectAll).subscribe((res) => {
      console.log(res);
    });
  }

  get() {
    this.store.dispatch({ type: action.ActionTypes.GetAll });
  }

  add(name: any) {
    this.store.dispatch({type: action.ActionTypes.preAdd, payload: { name: name }});
  }

  delete(row: number) {
    this.store.dispatch({type: action.ActionTypes.preDelete, payload: { id: row }});
  }