events - 在 Kendo UI Grid (Angular 2) 中选择行时触发事件

Question

在 Angular 2 的 Kendo UI(测试版)中，如何在选择特定行时触发事件？行本身没有指令或组件；因此，如果没有行元素，a (click)="triggeredFunction()"将无法工作。

这是我的网格:

<kendo-grid [data]="gridData" [selectable]="true">

  <kendo-grid-column field="ProductName">
    <template kendoHeaderTemplate let-column let-columnIndex="columnIndex">
     {{column.field}}({{columnIndex}})
    </template>
  </kendo-grid-column>     

  <kendo-grid-column field="ProductName">
    <template kendoCellTemplate let-dataItem>
      <kendo-dropdownlist [data]="listItems"></kendo-dropdownlist>
    </template>
  </kendo-grid-column>

</kendo-grid>

这是我的组件:

@Component({
 selector: "ultron",
 styleUrls: [String("./ultron.component.less")],
 templateUrl: "./ultron.component.html",
 })
 export class UltronComponent {

   private gridData: any[] = [{
      "ProductID": 1,
      "ProductName": "Chai",
      "UnitPrice": 18.0000,
      "Discontinued": true,
    }, {
      "ProductID": 2,
      "ProductName": "Chang",
      "UnitPrice": 19.0000,
      "Discontinued": false,
    }
  }];

  private listItems: Array<string> = ["@", "$", "#", "%"];

  public triggeredFunction(){ ... }

}

Answer 1

您需要设置的选项是selectable，有效值为true 和false，因为目前只支持单行选择。所以你的网格应该是这样的

<kendo-grid
      [data]="gridView"
      [selectable]="true"
    >
  </kendo-grid>

对于该事件，您需要附加一个 (selectionChange) 事件处理程序。这是一个plunkr