Редактор ячеек PrimeNG Datatable заполняет ячейку

Я использую следующий код для настройки редактора в моей таблице данных primeng:

<p-column field="vin" header="Vin" [editable]="true">
  <ng-template let-col let-car="rowData" pTemplate="editor">
        <textarea [(ngModel)]="car[col.field]" appendTo="body"></textarea>
  </ng-template>
</p-column>

Но я не могу понять, как мне подогнать редактор под размер ячейки. Мне удалось подобрать ширину только с помощью этого кода css, примененного к <textarea>:

.cell-editor {
  height: 100%;
  width: 100%;
}

введите здесь описание изображения Не могли бы вы мне помочь?


css primeng primeng-datatable
person Nikita Marinosyan    schedule 28.11.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

На вашем месте я бы исправил N строк для текстового поля (например, 3):

<textarea [(ngModel)]="car[col.field]" appendTo="body" class="datatableTextarea" rows="3"></textarea>

и примените 100% ширину к тегу textarea:

textarea {
    width: 100%;
}

Рабочий Plunker

person Antikhippe    schedule 28.11.2017
comment
Спасибо за ответ. Но если у нас есть второй столбец с меньшим количеством текста, и мы щелкаем, чтобы редактировать Audi Audi Audi ... строка будет уменьшаться по вертикали, и я бы хотел избежать этого. Вот плункер - person Nikita Marinosyan; 28.11.2017