@Input Angular не определено

Question

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

Не удается прочитать свойство 'id' из null в ListCategoryComponent.ngOnInit

Я попытался ответить на аналогичные темы, чтобы использовать различные хуки жизненного цикла в List-category.component.ts (ngOnChanges и AfterContentInit), но все еще, если не работает.

List.component.html - где я получаю JSON из серверной части и передаю его в дочерний раздел Forum-list-section.component

<app-list-section *ngFor="let section of sections" [section]="section" >
      </app-list-section>

List-section.component.ts - затем извлечь категории из раздела и передать его вниз

@Input() section;
  categories;

  ngOnInit() {
    this.categories = this.section['categories'];
  }

Список-section.component.html

<app-list-category
    *ngFor="let category of categories" [category]="category"
    class="forum__post">
  </app-list-category>

List-category.component.ts где я наконец получаю и отображаю полученные данные

@Input() category: Category;
  categoryId: string;
  latestThreadId: string

 ngOnInit() {
    this.categoryId = `${this.category.id }-${this.category.slug}`;
    this.latestThreadId = `${this.category.latest_thread.id}-${this.category.latest_thread.slug}`;
  }