Как предотвратить изменение размера столбца за пределы таблицы данных ngx? - PullRequest
Новая
       19

Как предотвратить изменение размера столбца за пределы таблицы данных ngx?

0 голосов
/ 29 мая 2019

Я использую ngx-datatable для отображения некоторых данных.Пользователь должен иметь возможность изменять размер столбцов, если соблюдены ограничения minWidth для столбцов и столбцы не выходят за пределы таблицы.

Основная часть файла HTMLследующее: 

<ngx-datatable
  #partsTable
  class="material"
  [columnMode]="'force'"
  [reorderable]="false"
  [rows]="osAperture.parts"
  (resize)="onResize($event, partsTable)"
>
  <ngx-datatable-column prop="description" [minWidth]="104">
  </ngx-datatable-column>
  <ngx-datatable-column prop="amount" [minWidth]="103">
  </ngx-datatable-column>
  <ngx-datatable-column prop="saleValue" [minWidth]="105">
  </ngx-datatable-column>
  <ngx-datatable-column prop="netValue" [minWidth]="109">
  </ngx-datatable-column>
</ngx-datatable>

Соответствующий файл TypeScript имеет следующее: 

@ViewChild('partsTable') partsTable: DatatableComponent;
@ViewChild('laborsTable') laborsTable: DatatableComponent;

onResize(event: any, table: DatatableComponent) {
  let width = 0;
  for (let column of table._internalColumns) {
    width += column.width;
  }
  if (width > table._innerWidth) {
    for (let column of table._internalColumns) {
      if (column.$$id == event.column.$$id) {
        table.onColumnResize({ column: column, newValue: column.minWidth });
        break;
      }
    }
  }
  table.recalculate();
}

Я попробовал приведенный выше код, но, когда пользователь уменьшает и увеличивает размеры столбцов, размерыячейки тела не соответствуют размерам ячеек заголовка.Размеры ячеек заголовка изменяются по мере того, как пользователь изменяет размеры столбца, но ячейки тела остаются неизменными.

...