在Angular 2的Kendo UI(beta)中,如何在选择特定行时触发事件?行本身没有指令或组件;因此,如果没有行元素,则(click)=“triggeredFunction()”无效 .
Here is my grid:
<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>
Here is my component:
@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(){ ... }
}
3 回答
您需要设置的选项是
selectable
,有效值是true
和false
,因为目前仅支持单行选择 . 所以你的网格应该是这样的对于该事件,您需要附加
(selectionChange)
事件处理程序 . 这是plunkr通过可选选项启用Kendo UI中的选择 . 通过selectionChange事件提供所选行索引和选定状态 . 如果您还在网格中对数据进行排序或分页,那么您将被绑定到GridDataResult . 要获取网格中所选行的绑定项,请使用GridDataResult的data属性 . 请参阅以下代码示例:
Just addition to original answer which is still true except one change in plunker
应该说 this.gridView.data[e.index]
如果有其他人访问此页面,则可以获取最新信息 .