如何使用Mat Table按空格分隔的多个关键字进行搜索

刘杰

我找到了一个应用简单过滤器的例子。您可以在下面找到链接。

https://stackblitz.com/edit/angular-mat-table-inline-editing?file=app%2Ftable-editing-example.ts

正如您看到的代码,一旦您输入搜索关键字,就将其修剪为 'heliumLi' 为 'Helium Li'。如果我想根据每个单词查找怎么办?像“氦”或“锂”。如果列值具有“Helium”或“Li”,我必须进行 foreach 并显示结果。我如何做到这一点?

G. 特兰特

您可以通过定义自定义filterPredicate函数来覆盖默认过滤行为(请参阅https://material.angular.io/components/table/overview#filtering)。对于您的示例,请尝试使用以下内容来匹配由空格分隔的精确符号或部分名称(均不区分大小写):

@Component({
  selector: 'table-editing-example',
  styleUrls: ['table-editing-example.css'],
  templateUrl: 'table-editing-example.html',
})
export class TableEditingExample {
  displayedColumns = ['position', 'name', 'weight', 'symbol', 'fav'];
  dataSource = new MatTableDataSource(ELEMENT_DATA);

  ngOnInit() {
    this.dataSource.filterPredicate = this.filterObject;
  }

  applyFilter(filterValue: string) {
    filterValue = filterValue.trim(); // Remove whitespace
    filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches
    this.dataSource.filter = filterValue;
  }

  filterObject(obj, filter): boolean {
    return filter.split(' ').some(
      item => obj.name.toLowerCase().indexOf(item) >= 0 || obj.symbol.toLowerCase() == item
    );
  }
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

使用多个关键字进行Hibernate Search的索引搜索

如何在循环中发送多个关键字以使用硒进行搜索?

如何进行基因剔除搜索多个关键字以及实时搜索

Rails + PostgreSQL - 使用全文搜索的多个关键字搜索

使用 jQuery 按关键字搜索 JSON

使用Java按关键字搜索Youtube视频

如何进行全文本关键字搜索

如何在laravel中搜索多个关键字?

如何修改此脚本以搜索多个关键字?

使用 SQL 进行多关键字搜索

在Cakephp中使用foreach搜索多个关键字

使用grep在不同的行上搜索多个关键字

有多个关键字时使用excel搜索功能

如何按关键字对 RecyclerView 项目进行排序?

如何使用using关键字进行字符串分隔?

如何使用mysqli Prepared语句从搜索字段中使用多个关键字执行LIKE查询

如何对在 Django 中使用关键字搜索后显示的对象结果进行排序

在Github中,如何使用多个关键字搜索存储库?

如何使用多个关键字在Google表格中搜索数据?

使用EntityFramework搜索关键字

使用关键字搜索HTML TD

使用FOSElasticaBundle多次搜索关键字

Hibernate Search 6 使用多个关键字搜索多个字段

如何使用ReactJS在javascript中搜索段落中的多个关键字并以不同颜色突出显示每个关键字?

如何为Mat-Icons使用Click Button关键字?

使用YouTube数据API V3按关键字搜索视频

Xamarin c# 使用 MS Graph API 按关键字搜索 Microsoft 365 日历事件

elasticsearch如何使用精确搜索并忽略关键字中的关键字特殊字符?

如何使用Mysql搜索关键字并获取匹配词?