如果找到的结果计数为空，Kendo Autocomplete 将停止工作

Question

我有以下自动完成功能。

问题是如果返回结果为空（没有值与输入中的给定文本匹配）自动完成停止工作，这意味着预加载器微调器始终显示在输入中，并且如果文本更改则不会创建请求。

我认为问题就在这里，但如果结果为空，我不知道要返回或设置什么：

 if(data.results == null) {
    growlNotifications.add($translate.instant('NO_ITEM_FOUND'), 'error',  $rootScope.notificationLifetime);
  return false;
} else {
  options.success(data.results);
}

这是每次更改模型值时调用的方法的代码（自动完成输入中的文本）。

非常感谢您的建议。

 $scope.$watch("teamDetail.newWorkerName", function(){
        console.log($scope.teamDetail.newWorkerName);

                $scope.customOptions = {
                    dataSource :  {
                        type: "json",
                        serverFiltering: true,
                        transport: {
                            read: function (options) {
                                console.log("List");
                                console.log(options.data);
                                console.log(options.data.filter.filters[0].value);
                                requestParams = {
                                    "entityName": "worker",
                                    "data" : {
                                        "page": 1,
                                        "pageSize": 20,
                                        "filter": {
                                            "logic": "or",
                                            "filters": [
                                                {
                                                    "value": $scope.teamDetail.newWorkerName,
                                                    "operator": "contains",
                                                    "field": "name",
                                                    "ignoreCase": true
                                                },
                                                {
                                                    "value": $scope.teamDetail.newWorkerName,
                                                    "operator": "contains",
                                                    "field": "surname",
                                                    "ignoreCase": true
                                                }
                                            ]
                                        },
                                        "sort": [
                                            {
                                                "field": "name",
                                                "ord": "asc"
                                            }
                                        ]
                                    }
                                };
                                ApiService.doHttpRequest(
                                    "POST",
                                    $rootScope.apiBaseUrl + "worker/search",
                                    requestParams
                                )
                                    .success(function (data, status, headers, config) {
                                        // successful data retrieval
                                        console.log("request success, checking state");
                                        console.log(data);
                                        // sent status to global HTTP status service
                                        var jsonResponse =  ApiService.processReturnedHttpState(status);
                                        console.log("Status response is " + jsonResponse.result);
                                        // do something with data
                                        switch (jsonResponse.result) {
                                            case true:
                                                if(data.results == null) {
                                                    growlNotifications.add($translate.instant('NO_ITEM_FOUND'), 'error',  $rootScope.notificationLifetime);
                                                    return false;
                                                } else {
                                                    options.success(data.results);
                                                }
                                                break;
                                            case false:
                                                growlNotifications.add($translate.instant('LIST_LOADING_ERROR'), 'error',  $rootScope.notificationLifetime);
                                                break;
                                        }
                                    })
                                    .error(function (data, status, headers, config) {
                                        console.log("Error");
                                        console.log("Autocomplete loading error");
                                    });
                            }
                        }
                    },
                    dataTextField: "name",
                    // using  templates:
                    template: '#: data.name # #: data.surname #',
                    change  : function (option, data) {
                        console.log("change");
                        console.log(this.value());
                    },
                    select: function(e) {
                        console.log("select");
                        var item = e.item;
                        var text = item.text();
                        var index = item.index();
                        console.log(item);
                        console.log(text);
                        console.log(index);
                        var dataItem = this.dataItem(index);

                        $scope.$apply(function() {
                            $scope.teamDetail.newWorkerName = text;
                        });

                        $scope.$apply(function() {
                            $scope.teamDetail.workers.push(dataItem);
                        });
                    }
                };
    });

Answer 1

KendoUI 需要一个空数组，而不是 null 或 undefined。您可以做的（如果您无法更改服务器返回的数据）是在 DataSource 定义中添加一个 schema 元素并定义一个 parse 函数，以在将 data 接收为 null 的情况下返回 [] （和空数组）。

类似：

dataSource: {
    transport : {
        read: ...
    },
    schema : {
        parse: function(data) {
            return data ? data : [];
        }
}

或者你可以修改你的代码来做：

if(data.results == null) {
    growlNotifications.add($translate.instant('NO_ITEM_FOUND'), 'error', $rootScope.notificationLifetime);
    // Return empty array instead of false
    return op.success([]);
} else {
    options.success(data.results);
}