Блог

Я использую PrimeNG beta 17 с Angular 2, и в моем шаблоне я использую таблицу данных следующим образом:

 <p-dataTable [value]="dataColumns" [(selection)]="selectedInputColumns">
      <p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>
      <p-column field="label" header="Column name"></p-column>
      <p-column header="Column Type">
          <template pTemplate type="body">
                <p-selectButton [options]="availableColumnTypes" [(ngModel)]="selectedColumnType"></p-selectButton>
              </template>
      </p-column>
 </p-dataTable>
  

Внутри одного столбца таблицы данных (заголовок «Тип столбца») Я хочу иметь дополнительную кнопку выбора (пользователь может выбирать между тремя состояниями), таким образом, у нас есть одна дополнительная информация на строку таблицы.

Компонент кнопки выбора из PrimeNG предлагает событие onChange, вызываемое, как только пользователь изменяет значение. Мой вопрос заключается в том, могу ли я внутри обработки событий получить информацию о том, какая строка таблицы данных была нажата, поскольку мне нужно сохранить дополнительную информацию для каждой строки таблицы.

@Emdee,

Пожалуйста, ознакомьтесь с моими предложениями ниже:

1. Я думаю, вам нужен ListBox, а не selectButton
2. Вы можете получить текущие данные строки внутри, <template> используя rowData

Обновленный шаблон:

 <p-dataTable [value]="dataColumns" [(selection)]="selectedInputColumns">
      <p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>
      <p-column field="label" header="Column name"></p-column>
      <p-column header="Column Type">
          <template let-rdata="rowData" let-rindex="rowIndex" pTemplate type="body">
                {{ rdata }} {{ rindex }} <!-- current row-data is obtainable at rdata and index at rindex -->
                <p-listbox [options]="availableColumnTypes" [(ngModel)]="selectedColumnType"></p-listbox>
              </template>
      </p-column>
 </p-dataTable>
  

Пожалуйста, попробуйте и дайте мне знать, работает ли это.