Angular Как реализовать вложенные преобразователи

Question

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

ngOnInit() {
    this.category = this.route.snapshot.data['category'];
}

Так что это прекрасно работает и получает меня категорию, которая по сути представляет собой список пользователей.

Я вручную получил данные учетной записи пользователя в ngOnInit() после того, как получил список имен пользователей из описанного выше преобразователя, но когда я передаю их в качестве Input() дочернему компоненту, они еще не загружены,

Это приводит к появлению ошибки ниже, что имеет смысл.

CategoryItemComponent.html:4 ERROR TypeError: Cannot read property 'id' of undefined
at Object.eval [as updateRenderer] (CategoryItemComponent.html:4)
at Object.debugUpdateRenderer [as updateRenderer] (core.js:11940)
at checkAndUpdateView (core.js:11312)
at callViewAction (core.js:11548)
at execComponentViewsAction (core.js:11490)
at checkAndUpdateView (core.js:11313)
at callViewAction (core.js:11548)
at execEmbeddedViewsAction (core.js:11511)
at checkAndUpdateView (core.js:11308)
at callViewAction (core.js:11548)
at execComponentViewsAction (core.js:11490)
at checkAndUpdateView (core.js:11313)
at callViewAction (core.js:11548)
at execEmbeddedViewsAction (core.js:11511)
at checkAndUpdateView (core.js:11308)
at callViewAction (core.js:11548)

Мои вопросы: могу ли я использовать этот список пользователей из первого распознавателя для использования в качестве входных данных для второго распознавателя. Если да, то как именно это делается?

Изменить 1:

В настоящее время я поставляю загруженных пользователей из ngOnInit() дочернему компоненту следующим образом:

<app-account [account]="account"></app-account>

Я понимаю, что могу ответить как @alokstar, но мне было интересно, если это рекомендуемый способ - или есть более элегантный способ вложения решателей.

Answer 1

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

<child-component *ngIf = 'dataAvailable'>
</child-component>

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