Угловой фильтр по динамическим столбцам

У меня есть функция фильтра, которая отлично работает, когда я использую в ней имя статического столбца, например:

this.listOfData = this.listOfData.filter((item: DataItem) =>
  item.name.toLowerCase().indexOf(newValue.toLowerCase()) !== -1
);

ПС: item.name

Но мне нужно искать в каждом столбце item, как я могу это сделать?

PS: name должен быть динамичным.

Мой ListofData имеет следующие столбцы:

listOfData({
  id: 
  ticket_number: 
  status_name:
  name: // currently my function is set to this value only.
  created_by_full_name:
  receive_time:
  response_time:
  resolution_time:
})

Обновлять

на основе ответа Allabakash у меня есть окончательный код ниже, который возвращает много ошибок машинописного текста:

ngOnInit(): void {
  // this listens to the input value from the service and does something on change.
  this.globalSearchService.searchTerm.subscribe((newValue: string) => {
    // this is where you would apply your existing filtering.
    this.searchTerm = newValue;
    if (newValue != null) {
      this.visible = false
      this.listOfData = this.listOfData.filter((item: DataItem) =>
      let keys = Object.keys(item);
      for (let key of keys) {
         if (typeof item[key] === 'string' && 
           item[key].toLowerCase().indexOf(newValue.toLowerCase()) !== -1) {
           return true;
         }
       }
       return false;
      );
    }
  });
}
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
233
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Если вы хотите выполнять динамический поиск по всем свойствам, вы можете попробовать что-то вроде этого.

this.listOfData = this.listOfData.filter((item: DataItem) => {
     let keys = Object.keys(item);
     for (let key of keys) {
       if (typeof item[key] === 'string' && 
         item[key].toLowerCase().indexOf(newValue.toLowerCase()) !== -1) {
         return true;
       }
     }
     return false;
    }
  );

спасибо, но это дает много ошибок машинописного текста, таких как , или Declaration or statement expected. я обновлю свой вопрос на основе вашего ответа

mafortis 12.12.2020 05:48

можете ли вы обернуть функцию фильтра внутри кода в фигурных скобках {}

Allabakash 12.12.2020 05:51

извини не понял что ты сказал

mafortis 12.12.2020 05:52

обновил ответ, где фигурные скобки отсутствовали, можешь попробовать

Allabakash 12.12.2020 05:53

конечно, создайте новый вопрос.

Allabakash 12.12.2020 05:55

Вы можете использовать ES6 для однострочного решения. Ниже приведен пример использования ванильного Javascript.

    const initialListOfData = [
      { name: 'Peter', surname: 'John'},
      { name: 'Judas', surname: 'James'},
      { name: 'Paul', surname: 'Peter'},
      { name: 'Petrover', surname: 'Junior'}
    ]

    const searchItem = 'pet'

    const listOfData = initialListOfData.filter(
      item => Object.keys(item).some(prop => 
        (new RegExp(searchItem.toLowerCase())).test(item[prop].toLowerCase())
    ))

    console.info(listOfData)

Для вашей проблемы с использованием машинописного текста это будет


this.listOfData = initialListOfData.filter(
   (item: any) => Object.keys(item).some((prop: any) => 
     (new RegExp(newValue.toLowerCase())).test(item[prop].toLowerCase())
 ))

Другие вопросы по теме