пытаясь получить значение из одного компонента в модуле в app.component.ts с помощью viewChild ()

Question

Я пытаюсь получить значение свойства (bookmarkedCount), присутствующее в компоненте модуля, для компонента приложения с использованием дочернего представления в app.component.ts. Но я получаю сообщение об ошибке при чтении значения свойства в компоненте приложения не определено,Почему это так?

ОШИБКА TypeError: Невозможно прочитать свойство 'bookmarkedCount' из undefined в AppComponent.push ../ src / app / app.component.ts.AppComponent.ngAfterViewInit (app.component.ts: 36)

app.component.ts

@ViewChild(ContainerComponent) private containerComponent:ContainerComponent;

ngAfterViewInit(): void {
    this.count = this.containerComponent.bookmarkedCount;  //getting error here reading the value of bookmarkedCount
}

Answer 1

Я думаю, что здесь вы делаете это правильно,

, но иногда вызывается ngAfterViewInit(), прежде чем ребенок будет воспроизведен.мы обычно используем ngOnInit() для такого рода привязок.

Так что попробуйте вот так ..

@ViewChild(ContainerComponent) private containerComponent:ContainerComponent;

ngOnInit() {
    this.count = this.containerComponent.bookmarkedCount;  
}

Я надеюсь, что это решит вашу проблему:)

Answer 2

Не нашел более легкого альтернативного решения. Так что, по крайней мере, я создал общую службу, чтобы получить значение bookmarkedCount в компоненте приложения и обновил ее при изменениях в службе. Здесь я вызываю метод changeCount всякий раз, когда добавляется / удаляется закладка щелкнул

 //for bookmark count 
  private count:number;

  private messageSource = new BehaviorSubject(this.count);
  currentCount = this.messageSource.asObservable();

  changeCount(count: number) {
    if(count!=undefined)
    this.messageSource.next(count);
  }

в app.component.ts ->

  updateCount(){
    this.dataService.currentCount.subscribe(res => {
      this.count = res;
    });
    return true;
  }

Answer 3

Попробуй вот так -

export class AppComponent  {
    bookmarkedCount: any;
    constructor(private containerComponentComponent: ContainerComponentComponent){
        this.bookmarkedCount = this.containerComponentComponent.bookmarkedCount;
   }
}

см. подробности здесь