来自另一个组件的 MatTableDataSource

Question

我有两个组件，Order 和 OrderDetail。

在Order中我有一个MatTableDataSource，它是由一个服务填充的。

订单组件

构造函数之前

listData: MatTableDataSource<DocumentDetailModel>;
displayedColumns: string[]= [ 'row','itemCode', 'itemName', 'priceListCode', 'priceListName', 
'wareHouseCode', 'wareHouseName', 'quantity', 'unitValue', 'ivaPercentage', 'valueBeforeIVA', 
'totalValue', 'cost', 'stock', 'profitMargin', 'actions'];  
 @ViewChild(MatSort) sort: MatSort;
 @ViewChild(MatPaginator) paginator: MatPaginator;

事件按钮获取

this.service.getDocument(this.service.form.value.documentDate, this.service.form.value.documentType, this.service.form.value.documentNumber).subscribe((data: DataResponseDocumentModel) => {      
    if(data.code === 1) 
    { 
      this.service.form.patchValue(data.documentHeader);
      this.service.form.disable();          
      this.getDataTable(data.lstDocumentDetail);
    }
});

函数

getDataTable(lstDocumentDetail) {
  this.listData = new MatTableDataSource(lstDocumentDetail);
  this.listData.sort = this.sort;
  this.listData.paginator = this.paginator;
  this.listData.filterPredicate = (data, filter) => {
    return this.displayedColumns.some(ele => {
      return ele != 'actions' && data[ele].toLowerCase().indexOf(filter) != -1;
    });
  }
}

从OrderDetailComponent开始，我想在MatTableDataSource关闭的时候补上，OrderDetail是一个MatDialog.

Image MatTable

Image MatDialog

关闭代码按钮MatDialog - OrderDetailComponent

onClose(){
  this.service.formDetail.reset();
  this.service.initializeFormDetailGroup();
  this.dialogRef.close();
}

此应用程序是 Angular9.1.12

Answer 1

您是否尝试获取对话框关闭事件？

 openDialog(): void {
    const dialogRef = this.dialog.open(OrderDialogComponent, {
      width: '250px',
      data: .....
    });

    dialogRef.afterClosed().subscribe(result => {
          Call Your reload Mat table function....        
    });
  }

来自另一个组件的 MatTableDataSource

MatTableDataSource from another component

typescript

angular-material

angular

mat-table

angular-cli-v9