Шаблон проектирования для комбинирования различных угловых компонентов - PullRequest
Новая
       20

Шаблон проектирования для комбинирования различных угловых компонентов

1 голос
/ 24 июня 2019

У меня есть приложение Angular6.Приложение имеет несколько страниц.Каждая страница состоит из нескольких компонентов.Компоненты в основном бывают двух типов: компонент фильтра и компонент сетки.Компоненты фильтра предоставляют входные данные о том, как фильтровать данные в сетке.Эти входные данные фильтра могут быть асинхронными.

<page>
 <filter-1></filter-1>
 <filter-2></filter-2>
 <filter-3></filter-3>
 <grid filters="filtersForData"></grid>
</page>

page.component.ts 

 filtersForData = [];
 callbackForFilter1(filter) { filters.push(filter)} // async
 callbackForFilter2(filter) { filters.push(filter)} // synchronous
 callbackForFilter3(filter) { filters.push(filter)} // async

Сейчас все работает как положено.Однако я хотел бы спроектировать вышеупомянутое так, чтобы, если у меня не было всех фильтров, я не должен загружать сетку.Причиной того, что некоторые вызовы являются асинхронными по природе, сетка выдает ошибку ExpressionChangedAfterEvaluation.Один мыслительный процесс также состоит в том, что все фильтры асинхронны или не возвращают наблюдаемое, и как только все наблюдаемые выполнены, загружается только сетка.Однако это вводит другую проблему написания и поддержания наблюдаемого.Кроме того, несколько фильтров, поступающих в разное время, вызовут многократный запуск onChanges, которого я хочу избежать.Как можно достичь вышеизложенного?

...