角度5-Ag网格添加行

Question

我正在尝试在“ Ag网格”中添加新行。

我将其很好地保存在数据库中，问题在于该行在视觉上被添加到“ Ag网格”中，但显示为空。

这是单击事件并添加行的代码。

this.gridOptions.api.updateRowData({ add: [form.form.value] });

这是变量“ gridOptions”：

this.gridOptions = {
    context: { componentParent: this },
    defaultColDef: {
        resizable: true,
    },
    rowSelection: 'multiple'
};

对象“ form.form.value”包含以下内容：

{CodPersona: "001", Nombre: "John", Descripcion: "John", Fecha: "2020-04-07"}

这是“ Ag网格”的html代码：

<ag-grid-angular class="ag-theme-material"
   [rowData]="rowData"
   [columnDefs]="columnDefs"
   [gridOptions]="gridOptions"
></ag-grid-angular>

数据库表包含以下字段：

IdPersona, CodPersona, Nombre, Descripcion, Fecha

这是浏览器中结果的屏幕截图：

注意：rowData我使用服务在事件“ ngInit”中加载它，谢谢。

Answer 1

在执行updateRowData之前，必须将行添加到rowdata：

this.rowData.push(form.form.value);
this.gridOptions.api.updateRowData({ add: [form.form.value] });

Answer 2

我假设您已将表格设置为可观察的形式。

在这种情况下，在onGridReady函数中，尝试使用setRowData（form_local_variable）设置行数据。这应该可以解决您的问题。

如果您可以共享此问题的演示链接，那将很好。