Фильтровать массив объектов из массива в TypeScript - PullRequest
Новая
       38

Фильтровать массив объектов из массива в TypeScript

0 голосов
/ 06 октября 2019

Я создал пользовательский компонент, который фильтрует массив объектов. Фильтр использует кнопки, устанавливает с активного на неактивный и позволяет включать / выключать более одной опции одновременно.

StackBlitz моей попытки - https://stackblitz.com/edit/timeline-angular-7-ut6fxu

В моей демонстрации вы увидите 3 кнопки / опции: север, юг и восток. Нажав на него, вы сделаете его активным, и результат должен включать или исключать совпадающее «местоположение» на севере, юге и востоке.

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

До сих пор я создал метод для создания массива отфильтрованных местоположений в зависимости от того, что пользователь нажимает на 3 кнопки.

Далее это переходит к моему "фильтрумассив ", который получает логику, которая должна сравнивать этот отфильтрованный массив с исходным, чтобы вернуть массив результатов, которые все еще остаются.

Это не совсем работает, и я не уверен, почему - у меня изначально работала эта функциональностьс помощью трубы, но по каким-то причинам не хотят идти в этом направлении. 

//the action
  toggle(location) {
    let indexLocation = this.filteredLocations.indexOf(location);

    if (indexLocation >= 0) {
      this.filteredLocations = this.filteredLocations.filter(
        i => i !== location
      );
    } else {
      this.filteredLocations.push({ location });
    }
    this.filterTimeLine();
  }

// the filter
  filterTimeLine() {
    this.filteredTimeline = this.timeLine.filter(x =>
      this.contactMethodFilter(x)
    );
  }

//the logic
  private contactMethodFilter(entry) {
    const myArrayFiltered = this.timeLine.filter(el => {
      return this.filteredLocations.some(f => {
        return f.location === el.location;
      });
    });
  }

https://stackblitz.com/edit/timeline-angular-7-ut6fxu

Ответы [ 2 ]

1 голос
/ 06 октября 2019

Извините за выражение, но у вас в коде катастрофа. ЯЯЯ !. Может быть, вы потеряли то, что вам нужно, но логика в ваших функциях так неправильно. сравнивая строку с объектами. фильтровать массив, который фильтрует тот же массив внутри ... так что вам нужно внести несколько изменений.

One: 

 this.filteredLocations.push({location});

Ваш объект выдвигается. вам нужно нажать только строку. 

 this.filteredLocations.push(location);

Два: 

  filterTimeLine() {
    this.filteredTimeline = this.timeLine.filter(x =>
      this.contactMethodFilter(x)
    );
  }

, в этой функции вы фильтруете массив timeLine. и внутри contactMethodFilter вы снова вызываете метод фильтра для timeLine ....

См. функциональное решение:

https://stackblitz.com/edit/timeline-angular-7-rg7k3j

0 голосов
/ 06 октября 2019 
private contactMethodFilter(entry) {
    const myArrayFiltered = this.timeLine.filter(el => {
      return this.filteredLocations.some(f => {
        return f.location === el.location;
      });
    });
  }

Эта функция не возвращает никакого значения и передается в .filter

Рассмотрите возможность возврата логического значения на основе вашей логики. В настоящее время фильтр становится неопределенным (ложным), и все будет отфильтровано

...