Angular ngx-datatable row-detail issues

Question

我在ngx-datatable中使用行详细信息时遇到两个问题。

1. rowIndex不起作用。我发现了一个描述问题的github问题，但据说它已在10.0.2版附近修复，我使用的是11.1.5（当前版本）。 {{rowIndex}}的每一行都返回0。我的解决方法是将我自己的索引写到列中，然后引用它，但我不必这样做。使用下面的代码，当我单击其中的每一行时，每一行都会进入编辑模式，因为它们都具有相同的rowIndex。

2. 我无法获取行明细行以使用其“父”行的全角。我怀疑是因为我使用的是[columnMode]="'flex'"，而演示使用的是columnMode] =“'force'”。我可以设置最小宽度，但是我不能获得宽度：100％可以工作。可能是因为有一个没有宽度的div包装器

   <ngx-datatable #dataTable class="material expandable"
     [rows]="rows"
     [limit]="50"
     [columnMode]="'flex'"
     [headerHeight]="50"
     [footerHeight]="50"
     [rowHeight]="50"
     [selectionType]="'single'"
     (select)="onSelect($event)"
     (activate)="onActivate($event)">
     <!-- Row Detail Template -->
       <ngx-datatable-row-detail [rowHeight]="50" #myDetailRow (toggle)="onDetailToggle($event)">
       <ng-template let-rowIndex="rowIndex" let-row="row" let-value="value" let-expanded="expanded" ngx-datatable-row-detail-template>
   <span class="rowDetail" title="Click to edit" (click)="editing[rowIndex + '-name'] = true" *ngIf="!editing[rowIndex + '-name']"> {{row.name}} </span>
       <mat-form-field floatPlaceholder='never' *ngIf="editing[rowIndex + '-name']">
       <input matInput style="min-width:300px" (keyup.enter)="updateValue($event, 'name', rowIndex)" type="text" [value]="row.name" />
     </mat-form-field>
   </ng-template>
   ...

Answer 1

[尝试在下面添加到您的styles.scss或styles.css文件中。这将强制明细行使用100％的宽度。但是，这只是一种解决方法，开发人员没有提供任何解决方案。

datatable-scroller {
  width: 100% !important;
}