Me gustaría actualizar los elementos que se muestran en una tabla de alfombras después de eliminar un elemento, sin volver a acceder al servidor. Funciona bien si elimino el elemento directamente desde el botón Eliminar en una fila, pero no funciona cuando se usa un cuadro de diálogo mat.

Aquí está mi código haciendo directamente (esto está funcionando):

HTML:

 <button mat-button (click)="delete(element)"></button>

TS:

 public delete(element) { this.myService.delete(element.ID).then(() => { const index = this.dataSource.data.findIndex(q => q.ID == element.ID); this.dataSource.data.splice(index, 1); }) }

Y aquí mi código está haciendo un cuadro de diálogo completo, donde no refresca la tabla:

HTML:

 <button mat-button (click)="openDialog(element)"></button>

TS:

 public openDialog(element) { const dialogRef = this.dialog.open(DeleteItemDialogComponent, { panelClass: ['backOfficeDialog'], data: {itemType: 'Document'} }); dialogRef.afterClosed().subscribe(response => { if (response.event == 'Delete') { this.delete(element); } }); } public delete(element) { this.myService.delete(element.ID).then(() => { const index = this.dataSource.data.findIndex(q => q.ID == element.ID); this.dataSource.data.splice(index, 1); }) }

MatDialogItem:

 export class DeleteItemDialogComponent implements OnInit { constructor( public dialogRef: MatDialogRef<DeleteItemDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any ) { } ngOnInit() { } public delete() { this.dialogRef.close({event: 'Delete'}); } closeDialog() { this.dialogRef.close({event: 'Cancel'}); } }

¿Sabes por qué en el segundo caso no refresca la tabla, qué estoy haciendo mal y cómo solucionarlo?

¡Gracias!