Kendo UI Angular全球搜索

Question

简短的问题，我试图四处寻找如何进行Kendo UI Angular的全局搜索。我的意思是global search，在kendo表外面有一个文本字段，然后我们在字段中键入任何内容，然后kendo表将加载并搜索数据。

我使用Kendo Angular Jquery完成了此操作，但到目前为止，我无法找到有关如何global search Kendo UI Angular

的解决方案

如果有人使用此功能，可以与我分享如何为global search表格执行Kendo UI Angular。

注意：我正在使用angular 4进行当前的开发。

非常感谢

Answer 1

除了过滤行之外，我不知道任何其他功能。 您可以创建自己的过滤器来实现这一点，因为毕竟，您只是将数据数组提供给kend-grid

所以我创建了一个searchInput管道，它接受关键字参数

<kendo-grid [data]="gridData | searchInput: keyword">

1. 构建自定义管道，并为其提供数据数组，以及substring
等参数

我猜你已经有了一个模特......这样的事情

export class DeviceType {
  constructor(
    public deviceId: string,
    public deviceType: string,
    public currentUser: string
  ) {}
};

您可以使用过滤器功能，并为其提供一个回调函数，该函数将参数输入与每个数据元素进行比较。在这个例子中注意只比较两件事，你可以轻松地与几个成员一起做。

@Pipe({
  name: 'searchData'
})
export class SearchData implements PipeTransform {
  transform(data: DeviceType[], arg: string): any {
    return data.filter(item => {
      if (arg) {
        const searchInput = arg.toLowerCase();
        const deviceId = item.deviceId.toLowerCase();
        const deviceType = item.deviceType .toLowerCase();

        if(deviceId.includes(searchInput) || deviceType .includes(searchInput)){
          return item;
        }
      }
});

} }

1. 创建输入表单并将其作为参数提供给

2. 管道输入数据，并使用输入中输入的字符串提供参数。