Не удается получить доступ к свойству @ViewChild в angular родительском компоненте

Question

child.component.ts

currentPage = 1;

parent.component.ts

export class ParentComponent implements OnInit, AfterViewInit {
  @ViewChild(ChildComponent, {static: false}) child;
  ngAfterViewInit() {
      console.log(this.child.currentPage); // throws error
  }

parent.component.ts

<app-child></app-child>

Я попытался установить тайм-аут, но он также не работает.

ОШИБКА TypeError: Невозможно прочитать свойство 'currentPage' из неопределенного

Что я делаю неправильно?

Answer 1

укажите имя и тип компонента в дочернем представлении следующим образом

@ViewChild(HelloComponent, {static: false}) hello: HelloComponent;

см. Пример stackblitz

Answer 2

Работает.

parent.component.ts

export class AppComponent implements AfterViewInit {

  @ViewChild('child', {static: true})
  child: ChildComponent;

  ngAfterViewInit() {
    console.log(this.child.currentPage); // works
  }
}

parent.component. html

<app-child #child></app-child>

child.component.ts

export class ChildComponent {
    currentPage = 1;
}

Answer 3

Попробуйте так:

. html

<app-child #ChildComponent></app-child>

.ts

@ViewChild("ChildComponent", {static: true}) child:ChildComponent;