Невозможно отфильтровать данные по нескольким условиям

Question

HI У меня есть JSON Array из БД, как показано ниже структуры

[{
Attachments: null
ConstructionTypeID: "c2da0a32-2a07-11e9-9500-90b11c61d394"
ConstructionTypeName: "New"
ContractTypeID: "f7adf340-2a07-11e9-9500-90b11c61d394"
ContractTypeName: "Private"
Description: "ddd"
EndDate: "2019-06-27T18:30:00.000Z"
IssueCount: 0
ModelCount: 1
Name: "Sang"
ProjectAddress: null
ProjectID: "01418e66-85f3-11e9-a8cd-38607725a846"
ProjectSubTypeID: "dccd7be7-2a06-11e9-9500-90b11c61d394"
ProjectSubTypeName: "Retail"
ProjectTypeID: "c7569d2a-2a05-11e9-9500-90b11c61d394"
ProjectTypeName: "Commercial"
RevisionID: "1"
RuleCount: 0
StartDate: "2019-06-02T18:30:00.000Z"
SubProjCount: 0
}]

, и у меня есть несколько фильтров для применения в соответствии с требованиями пользователя. Пожалуйста, смотрите скриншот ниже.

Здесь пользователь может изменить текстовое поле фильтра и диапазон дат. поэтому на основе этих двух условий я должен отфильтровать записи и показать их в представлении. если пользователь очистит / обновит значения фильтра текста / диапазона дат, то соответствующая функциональность должна работать. если пользователь удалит два условия, я должен снова показать все записи. Пожалуйста, предоставьте, если у вас есть идеи. заранее спасибо. Я реализовал ниже, но не работает.

filterProjectDatas() {
    this.filteredData = [];
    if ('Name' in this.data[0]) {
      this.filteredData = this.data.filter((item: any) => {
        return ((this.filterModal.searchStirng && item.Name.toLowerCase().includes(this.filterModal.searchStirng.toLowerCase())) &&
          (this.filterModal.dateFilter && (new Date(item.StartDate) > this.filterModal.dateFilter[0] && new Date(item.EndDate) < this.filterModal.dateFilter[1])));
      });
    }
    // if ('IssueName' in this.data[0]) {
    // }
    this.filterData.emit(this.filteredData);
  }

Answer 1

Вы можете использовать оператор || для каждой группы фильтров.Это будет проверять второе условие, только если searchStirng и dateFilter имеют non-falsy значение:

this.filteredData = this.data.filter((item) =>
  (!this.filterModal.searchStirng || item.Name.toLowerCase().includes(this.filterModal.searchStirng.toLowerCase()))
  && (!this.filterModal.dateFilter || (new Date(item.StartDate) > this.filterModal.dateFilter[0] && new Date(item.EndDate) < this.filterModal.dateFilter[1]))
)

Если searchStirng пусто или равно нулю, !searchStirng будетвернуть true и второе условие в этой группе не будет проверено.