如何根据下拉列表中的值选择更新 ngx-datatable 中下一个单元格的值？

Question

我正在尝试更新另一个单元格值，在第一个单元格中我有一个下拉列表，并且根据下拉列表中值的选择，我必须更新下一列中下拉列表的值。

如何使用 ngx-datatable-columns 实现此目的？

这是包含下拉列表的单元格：

 <ngx-datatable-column name="status" prop="operationStatus" >
    <ng-template let-value="value" let-row="row" let-rowIndex="rowIndex" ngx-datatable-cell-template>

        <select class="status" (change)="changeStatus($event, rowIndex)">
          <option *ngFor="let e of selectableGerateStatus" [selected]="value == e.id">
               {{e.label}}
            </option>
        </select>

    </ng-template>
  </ngx-datatable-column>

这是需要更新的单元格：

<ngx-datatable-column name="casette" prop="cassette1Bill">
    <ng-template let-column="column" ngx-datatable-header-template>
      <span>Kassette 1</span>
    </ng-template>
    <ng-template let-value="value" let-row="row" let-rowIndex="rowIndex" ngx-datatable-cell-template>
          <div>{{value}}</div>

    </ng-template>
  </ngx-datatable-column>

Answer 1

实际上，您已经拥有整行的数据供您使用，因为您在列上使用了 let-row。由于您已将 row 分配给 let-row，因此您可以将 row（这是一个包含该行数据的对象）传递给您的 (change) 事件绑定。

在您的 .html 文件中，只需对该列的下拉菜单进行以下更改：

<ngx-datatable-column name="status" prop="operationStatus" >
    <ng-template let-value="value" let-row="row" let-rowIndex="rowIndex" ngx-datatable-cell-template>

    <select class="status" (change)="changeStatus(row)">
      <option *ngFor="let e of selectableGerateStatus" [selected]="value == e.id">
               {{e.label}}
      </option>
    </select>

  </ng-template>
</ngx-datatable-column>

基本上，我们已经将行详细信息 row 传递给 changeStatus()

然后在您的 component.ts 上，只需将该值分配给 cassette1Bill 列

changeStatus(row) {
  //console.log(row)
  row.cassette1Bill = '22';
}

这应该有效。该列应反映所选下拉值的更新值。

如何根据下拉列表中的值选择更新 ngx-datatable 中下一个单元格的值？

How can I update the next cell's value in ngx-datatable based on the selection of value in a dropdown?

ngx-datatable

angular