提交表单后刷新 Mat 表上的数据答案

【问题标题】：Refresh data on Mat table after Form Submission提交表单后刷新 Mat 表上的数据
【发布时间】：2020-10-28 22:32:50
【问题描述】：

我必须在提交表单后刷新 mat 表。我按照以下步骤使用表格进行操作。服务

refreshList(){
    this.http.get(this.rootURL+'/PaymentDetail').toPromise().then(res => this.list = res as PaymentDetail[]);
    }

然后我在 ngOnInit 和 payment-detail-component.ts（提交表单的组件）和 payment-detail-list.component.ts（我在这里显示表格）的 Submit 函数中调用它。

查看付款详情。

<div class="jumbtron">
    <h1 class="display-4 text-center">Payment Detail Register</h1>
    <hr>
    <div class="row">
        <div class="col-md-5">
            <app-payment-detail></app-payment-detail>
        </div>
        <div class="col-md-7">
            <app-payment-detail-list></app-payment-detail-list>
        </div>
    </div>
</div>

在我使用 Mat Table 时执行此过程是行不通的。为什么垫表不以这种方式刷新？在这种结构中提交表单后如何刷新 Mat Table 中的数据？

【问题讨论】：

标签： angular angular-material angular-ui-router

【解决方案1】：

要刷新材质数据表中的数据，需要将新数据赋给dataSource对象

this.dataSource = new MatTableDataSource<any[]>(newData);

你可以看例子here

【讨论】：

为了将数据显示到 mat 表中，我在 payment-detail-list 组件中定义了 dataSource。但我必须从另一个名为 payment-detail 的组件中刷新它。我必须将 dataSource 重新创建到 payment-detail 组件中？