Раскрывающийся фильтр KendoUI не работает с AngularJS - PullRequest
Новая
       11

Раскрывающийся фильтр KendoUI не работает с AngularJS

0 голосов
/ 28 апреля 2019

Я пытаюсь добавить фильтр в раскрывающийся список KendoUI, и кажется, что он не работает.фильтр отлично работает без угловых.Но когда я добавляю это к angular, он не показывает фильтр типов внутри выпадающего списка.Я использовал тот же пример, который находится на официальном сайте. 

<div ng-controller='myctrl'>
    <h4 style="padding-top: 2em;">Remote data</h4>
    <select kendo-drop-down-list
            k-data-text-field="'ProductName'"
            k-data-value-field="'ProductID'"
            k-data-source="productsDataSource"
            style="width: 100%">
    </select>
<div>

Контроллер 

angular.module('myApp', ["kendo.directives"])
.controller('myctrl', ['$scope', function($scope) {
    $scope.productsDataSource = {
        type: "odata",
        serverFiltering: true,
        filter: "startswith",
        transport: {
            read: {
                url: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products",          
            }
        }
    };    
}]);

Это jsfiddle .

1 Ответ

2 голосов
/ 28 апреля 2019

Вы неправильно размещаете свойство «фильтр».См. Демонстрационное руководство .

Свойство filter должно находиться в элементе раскрывающегося списка kendo, но так как раскрывающийся список kendo не используется в качестве тегаи просто используя его как свойство элемента select, вам нужно добавить свойство filter в тег элемента.См. Ниже: 

<select kendo-drop-down-list
    k-data-text-field="'ProductName'"
    k-data-value-field="'ProductID'"
    k-data-source="productsDataSource"
    filter="'startsWith'"
    style="width: 100%"></select>
<div>

и, конечно, удалите свойство фильтра из вашего углового модуля 

angular.module('myApp', ["kendo.directives"])
    .controller('myctrl', ['$scope', function($scope) {
        $scope.productsDataSource = {
                type: "odata",
                serverFiltering: true,
                transport: {
                    read: {
                        url: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products",
                    }
                }
            };
        }]);

См. JSFilddle форк вашего JSFiddle

...