时间戳

首页 > 解决方案 > 搜索为 unicode 角度

angular - 搜索为 unicode 角度

问题描述

我想搜索pokemon并找到所有神奇宝贝结果（带重音）

我的数组：

let games = ['The Legend of Zelda', 'Pokémon', 'Chrono Trigger']

我的表现如何：

HTML

<input type="text" [(ngModel)]="search">
<ul>
  <li *ngFor="let game of games | filterBy:[]:search">{{game}}</li>
</ul>

我正在使用ng-pipes包来使用filterBy

TS

public search: string = ''

但是如果我输入pokemon他不匹配Pokémon

标签： angulartypescript

解决方案

谢谢大家，我通过做一些测试设法解决了。我决定创建一个返回正则表达式处理的值的函数。

关注结果

TS

public games = ['The Legend of Zelda', 'Pokémon', 'Chrono Trigger']
public gamesCopy = this.games

public search: string = ''

private slug(val) {
  val = val.replace(/[áàãâä]/g, 'a')
  val = val.replace(/[ÁÀÃÂÄ]/g, 'a')
  val = val.replace(/[éèêë]/g, 'e')
  val = val.replace(/[ÉÈÊË]/g, 'e')
  val = val.replace(/[íìîï]/g, 'i')
  val = val.replace(/[ÍÌÎÏ]/g, 'i')
  val = val.replace(/[óòõôö]/g, 'o')
  val = val.replace(/[ÓÒÕÔÖ]/g, 'o')
  val = val.replace(/[úùûü]/g, 'u')
  val = val.replace(/[ÚÙÛÜ]/g, 'u')
  val = val.replace(/[ç]/g, 'c')
  val = val.replace(/[Ç]/g, 'c')
  return val.toLowerCase()
}

public searching(search: string) {
  this.gamesCopy = this.games.filter(res => this.slug(res).indexOf(this.slug(search)) > -1)
}

HTML

<input type="text" [(ngModel)]="search" (ngModelChange)="searching($event)">
<ul>
  <li *ngFor="let game of gamesCopy">{{game}}</li>
</ul>

我删除了ng-pipes

而已 ：）

推荐阅读