Получить DataItem из Kendo Grid с помощью пользовательской кнопки в Angular - PullRequest
Новая
       42

Получить DataItem из Kendo Grid с помощью пользовательской кнопки в Angular

0 голосов
/ 17 сентября 2018

Я пытаюсь передать dataItem из сетки кендо компоненту на Angular 6. Установите следующим образом. 

<kendo-grid
      [data]="view | async"
      [height]="533"
      (dataStateChange)="onStateChange($event)"
      (edit)="editHandler($event)" (remove)="removeHandler($event)"
      (add)="addHandler($event)"
    >
    <ng-template kendoGridToolbarTemplate>
        <button kendoGridAddCommand>Add new</button>
    </ng-template>
    <kendo-grid-column field="Id" title="ID"></kendo-grid-column>
    <kendo-grid-column field="Name" title="Company Name"></kendo-grid-column>
    <kendo-grid-column field="BillingInfo.BillingGroup" title="Group"></kendo-grid-column>
    <kendo-grid-column field="DefaultProcessingLocation" title="Default Location"></kendo-grid-column>
    <kendo-grid-column field="BillingInfo.BillingCode" title="Code"></kendo-grid-column>
    <kendo-grid-command-column title="Action" width="300">
        <ng-template kendoGridCellTemplate let-dataItem>
            <button kendoGridEditCommand [primary]="true">Edit</button>
            <button kendoGridRemoveCommand>Delete</button>
            <button (click)="getCustomerJobs(dataItem)">Jobs</button>
        </ng-template>
    </kendo-grid-command-column>
  </kendo-grid>

  <app-edit-customer [model]="editDataItem" [isNew]="isNew"
  (save)="saveHandler($event)"
  (cancel)="cancelHandler()">
</app-edit-customer>

Когда я нажимаю на редактирование или удаление элемента данных, я вижу элемент данных. Однако, когда я нажимаю «Рабочие места», getCustomerJobs возвращает dataItem как «неопределенное».

Заранее спасибо за помощь.

1 Ответ

0 голосов
/ 17 сентября 2018

Я верю, что вы близко. Проблема заключается в разметке кендо-сетки-столбца .

Изменить это ( kendo-grid-command-column ) ... 

 <kendo-grid-command-column title="Action" width="300">
    <ng-template kendoGridCellTemplate let-dataItem>
        <button kendoGridEditCommand [primary]="true">Edit</button>
        <button kendoGridRemoveCommand>Delete</button>
        <button (click)="getCustomerJobs(dataItem)">Jobs</button>
    </ng-template>
</kendo-grid-command-column>

К этому ( кендо-сетка-столбец ) .. 

 <kendo-grid-column title="Action" width="300">
    <ng-template kendoGridCellTemplate let-dataItem>
        <button kendoGridEditCommand [primary]="true">Edit</button>
        <button kendoGridRemoveCommand>Delete</button>
        <button (click)="getCustomerJobs(dataItem)">Jobs</button>
    </ng-template>
</kendo-grid-column>
...