我有一个kendo ui listView ,我想让项目可选(单个选择)。我在互联网上没有找到任何呈Angular的样本。
我要做的是为所选项目设置样式,并根据所选项目进行一些调用。
这是我的 html :
<div class="list-group no-radius no-border no-bg m-b-none"
kendo-list-view="publishPositionsListView"
k-options="ctrl.publishPositionsSourceOptions"
k-data-source="ctrl.publishPositionsSource">
<a class="list-group-item p-l hover-anchor b-a no-select ng-scope" k-template>
<span>{{dataItem.Title}}</span>
</a>
</div>
这是我的 JavaScript :
vm.publishPositionsSource = new kendo.data.DataSource({
dataType: "aspnetmvc-ajax",
transport: {
read: {
url: "publish/getall",
type: "GET"
}
},
schema: {
type: "json",
data: "Data",
total: "Total",
model: {
id: "Id"
}
}
});
vm.publishPositionsSourceOptions = {
dataBound: function (e) {
// Set selected style for the first item when loaded
e.sender.element.children().first().addClass("focus");
}
}
有什么想法吗?我想知道是否有一种方法而不是使用ng-click
要在kendoui listView上启用单个选择,请在listView-config中添加 selectable: "Single"
。您还可以使用ListView的select
方法以编程方式设置所选项目。
当您将它们放在一起时,可能看起来像这样:
$scope.listViewOptions = {
dataSource: $scope.myDataSource,
selectable: "Single",
dataBound: function(event) {
/* Select the first item here */
},
change: function(event) {
/* Do something with the selected item */
}
}
我还创建了一个工作的dojo(虽然它不使用Angular)。