如何在 Json/array 中获得与用户输入相同的值？答案

【问题标题】：How to get the same value in a Json/array as the user input?如何在 Json/array 中获得与用户输入相同的值？
【发布时间】：2018-02-21 14:33:09
【问题描述】：

我想通过 Json 搜索并获得与用户输入相同的值。我不知道为什么我的代码不起作用。所以例如用户搜索汽车。如果汽车在 Json 中。它应该在页面中显示汽车一词。这是我的代码：

管道：

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


@Pipe({
  name: 'filter'
})
export class FilterPipe implements PipeTransform {
transform(items: any[], searchText: string): any[] {
if(!items) return [];
if(!searchText) return items;
searchText = searchText.toLowerCase();
return items.filter( it => {
        return it.toString().toLowerCase().includes(searchText);
});

} }

HTML：

      <li *ngFor="let char of characters | filter : searchText" > 
          {{ searchText}}  
          {{char.name}}
          {{char.age}}
      </li>

</ul>

组件：

export class SearchComponent  {
characters: any[] = [
      {
        "name": "audi",
        "age": 1999
      },
      {
        "name": "toyota",
       "age": 2000
      }



}

【问题讨论】：

标签： json angular pipe ngfor

【解决方案1】：

你的管道应该是这样的

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
 name: 'filter'
})
export class FilterPipe implements PipeTransform {
transform(items: any[], searchText: string): any[] {
if(!items) return [];
if(!searchText) return items;
searchText = searchText.toLowerCase();
return items.filter( it => {
    return it.name.toString().toLowerCase().includes(searchText);
});

【讨论】：

谢谢，还是不行。我认为问题出在html文件中。我无法将“character.name”中的值与输入值进行比较。你知道我该怎么做吗？
如何输入搜索文本值？是否使用模板引用变量？
我在您的帮助下修复了它！在我删除“ :any[] ”的组件中，它工作正常。谢谢

【解决方案2】：

我认为 it.toString() 返回类似：[object Object]

试试 JSON.stringify(it).toLowerCase().includes(searchText);

【讨论】：