Кендо угловая сетка столбца передать datatem в NG-шаблон - PullRequest
0 голосов
/ 12 июня 2018

Я использую Angular 5.2 с элементами управления Kendo.Внутри сетки у меня есть кнопка со свойством click.Я хочу передать значение PID в функцию showwindow в качестве параметра .

Вот пример кода: -

 <kendo-grid [data]="gridView"
                (pageChange)="pageChange($event)"
                [selectable]="true"
                [kendoGridSelectBy]="mySelectionKey"
                [selectedKeys]="mySelection"
                style="width:1100px;">
        <kendo-grid-checkbox-column showSelectAll="true" width="50" media="(min-width: 10px)">
            <ng-template kendoGridHeaderTemplate let-dataItem>
                <input type="checkbox"
                       name="selectAll"
                       (change)="selectAllRows($event)"
                       [checked]="allRowsSelected" />
            </ng-template>
        </kendo-grid-checkbox-column>
        <kendo-grid-column field="PID" title="User ID" width="150" media="(min-width: 10px)">
        </kendo-grid-column>

        <kendo-grid-command-column title="View file" width="200" media="(min-width: 10px)">
            <ng-template kendoGridCellTemplate let-isNew="isNew">
                <button (click)="showwindow(pass the PID value here)">
                    <img src="../../../../../Images/view.png" />
                </button>
            </ng-template>
        </kendo-grid-command-column>
    </kendo-grid>

Вот обработчик нажатия кнопки, который я хочу изменить: -

 <button (click)="showwindow(pass the PID value here)">
     <img src="../../../../../Images/view.png" />
  </button>

Пожалуйста, предложите решение.

1 Ответ

0 голосов
/ 12 июня 2018

Вы можете получить доступ к текущим строкам dataItem (и другим переменным) через контекст шаблона директивы kendoGridCellTemplate.( Справочник по API )

<kendo-grid-command-column ...>
    <ng-template kendoGridCellTemplate let-dataItem>
        <button (click)="showwindow(dataItem.PID)">
            <img src="../../../../../Images/view.png" />
        </button>
    </ng-template>
</kendo-grid-command-column>
...