【问题标题】:How do I make text filter case-insensitive?如何使文本过滤器不区分大小写?
【发布时间】:2017-05-03 04:28:24
【问题描述】:

我当前的文本过滤器成功过滤了一个数组并仅输出完全匹配的大小写。我希望能够在不匹配不影响各自案例的搜索结果的情况下进行搜索。

users = [
  {fname: 'John', lname: 'doe'},
  {fname: 'Jane', lname: 'Doe'}
];

<h3>USERS</h3>
<input type="text" Name="userSearch" [(ngModel)]="userSearch">

<ul *ngFor="let user of users">
  <li>{{ user.fname }} {{ user.lname }}</li>
</ul>

搜索文字:doe
搜索结果:John doe
预期结果:John doe,Jane Doe

当前文本过滤器管道:

import {Pipe, PipeTransform} from '@angular/core';

@Pipe({ name: 'textFilter' })
export class TextFilter implements PipeTransform
{
  transform(value: any, term: any) {
    if (!term) { return value; }
    return value.filter((item: any) => {
      for (let prop in item) {
        if (typeof item[prop] === 'string' && item[prop].indexOf(term) > -1) {
          return true;
        }
      }
      return false;
    });
  }
}

【问题讨论】:

    标签: angular angular2-pipe angular-pipe


    【解决方案1】:

    试试这个

    @Pipe({ name: 'textFilter' })
    export class TextFilter implements PipeTransform
    {
      transform(value: any, term: any) {
        if (!term) { return value; }
        return value.filter((item: any) => {
          for (let prop in item) {
            if (typeof item[prop] === 'string' && 
              item[prop].toLowerCase().indexOf(term.toLowerCase()) > -1) {
              return true;
            }
          }
          return false;
        });
      }
    }
    

    【讨论】:

      猜你喜欢
      • 2013-10-24
      • 1970-01-01
      • 2013-08-07
      • 2022-12-02
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多