Search for a string in all properties of an object in Angular 2

霸气de小男生 提交于 2020-12-25 08:51:13

问题


How to search for a string in all properties of an object in Angular 2 with TS.

I have an array of customers rendered in a table with a search box, if the user types a value I want to search for all properties values to push a customer that matches the value typed.

export var CUSTOMER: Client[] = [
  { id: 1, name: 'John', phone: '888-888-888'},
  { id: 2, name: 'Nick', phone: '555-888-888'},
  { id: 3, name: 'Mike', phone: '666-888-888'},
];

The Filter Pipe

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

@Pipe({
  name: 'filter',
  pure: false
})
@Injectable()
export class Ng2SearchPipe implements PipeTransform {

  transform(items: any, term: any): any {
    if (term === undefined) {
      return items;
    }

    return items.filter(function(item){
      return item.name.toLowerCase().includes(term.toLowerCase());
    });
  }
}

In the filter pipe above I can only search by the name. I'm not sure how to approach this. Should I create a method for the Customer object that returns all property values concatenated and then search for the term on this concatenated value?


回答1:


You need to apply null check and use .toString() otherwise if value will be number it will not be able to use toLowerCase() method and will raise error.

return items.filter(item =>
  Object.keys(item).some(
    k =>
      item[k] != null &&
      item[k]
        .toString()
        .toLowerCase()
        .includes(term.toLowerCase())
  )
);



回答2:


You can loop over the keys of the item and see if any of them include the string, and return true if any number of them match:

return items.filter(item =>
  Object.keys(item).some(k => item[k].includes(term.toLowerCase());
)


来源:https://stackoverflow.com/questions/41901643/search-for-a-string-in-all-properties-of-an-object-in-angular-2

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!