如何根据下拉列表中的值选择更新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';
}

这应该工作。该列应反映所选下拉值的更新值。