Question

我想在Kendo UI Grid中为布尔值设置一个带有下拉列的行过滤器。

经过几个小时的搜索，我找到了这篇有用的文章 KendoUI Grid row filter with dropdown for boolean指向一个非常有用的示例http://dojo.telerik.com/alepI

的链接

但它在我的角度环境中不起作用。花了几个小时后，我发现将数据绑定到kendo网格的方法很有用。

使用angular及其异步加载数据，我发现将网格数据与网格选项分开非常有用。所以我在HTML模板中以这种方式使用normaly：

<kendo-grid 
    options="vm.gridOptions" 
    k-data-source="vm.gridData" 
    k-ng-delay="vm.gridOptions">
</kendo-grid>

并在angularJs文件中定义数据，如：

angular.module('my').factory('myGridCtrl', myGridCtrl);
function myGridCtrl() {
    vm.gridData = [
        {id: 1, ProductName: 'foo', Discontinued: false}
        {id: 2, ProductName: 'bar', Discontinued: true}
        ....
    ];

    vm.gridOptions = {
         // defining the options like in the example (without the data)
    };
 }

但是带有布尔下拉列表的行过滤器将不起作用。错误消息是“.toLowerCase不是函数”。这个问题的答案是，将数据字段定义为“布尔”。但就像在dojo示例中一样，我已经将数据字段定义为“Boolean”。

获得过滤器工作的方法是定义HTML模板，如：

<kendo-grid 
    options="vm.gridOptions"  
    k-ng-delay="vm.gridOptions">
</kendo-grid>

并且angularJs喜欢：

angular.module('my').factory('myGridCtrl', myGridCtrl);
function myGridCtrl() {
    var gridData = [
        {id: 1, ProductName: 'foo', Discontinued: false}
        {id: 2, ProductName: 'bar', Discontinued: true}
        ....
    ];

    vm.gridOptions = {
        dataSource: {
            data: gridData
        }
        // defining all other options like in the example (without the data)
    };
 }

所以我的问题是：为什么通过html-attribute或js-object将数据绑定到kendo网格会有什么不同？

哪个是使用angular？

将数据绑定到kendo网格的最佳方法

解决方案

使用带有Kendo UI Grid的angular时，是否需要使用k-data-source属性绑定数据。数据数组必须是DataSource对象。否则，数据更改时不会更新网格（使用角度时非常重要）。更多内容请阅读http://www.telerik.com/blogs/a-few-angular-kendo-ui-best-practices

考虑到这一点，我必须再尝试一下字段类型定义。我定义了'dataSource / model / fields'中的所有字段 - 部分选项，现在它可以正常工作。不知道为什么现在有效。

Kendo Grid＆amp; Angular：当通过k-data-source属性支持数据时，boolean的行过滤将不起作用

0 个答案: