Угловой родительский элемент к дочернему элементу

#angular #dom #parent-child #communication

#angular #dom #родитель-потомок #Информационные материалы

Вопрос:

Изначально мой родительский компонент не имеет никакого отношения к дочернему элементу. Просто список элементов. но когда пользователь нажимает на список, загружается дочерний компонент. затем я могу вызвать метод дочернего компонента из родительского, используя @ViewChild. Но это изначально не работает, потому что изначально нет отношения родитель-потомок. как я могу это решить.

Ответ №1:

Я думаю, вы можете использовать EventEmitter1. В компоненте вы можете выдавать любое сообщение при его загрузке. И в другом компоненте вы можете подписаться на eventemitter.

Ответ №2:

Вы могли бы использовать @ViewChildren который очень похож, но также работает с элементами, которые еще не присутствуют до AfterViewInit перехвата жизненного цикла. Плюс это оборачивает ваши элементы в список запросов.

QueryList действительно имеет changes свойство, на которое можно подписаться, которое является наблюдаемым. Реализация могла бы выглядеть примерно так:

 export class SomeComponent implements AfterViewInit {

  @ViewChildren(ChildComponent) children: QueryList<ChildComponent>;

  ngAfterViewInit(): void {
    this.children.changes.subscribe(children => {
      children.forEach( (child: ChildComponent) => {
        child.somePublicMethod();
      });
    });
  }
}
  

Ответ №3:

Я использовал @input () для передачи значения от родительского к дочернему и использовал

 ngOnChanges (changes: SimpleChanges) {
 for (let propName in changes) {
     let change = changes[propName];
     console.log(change);
 }
  

}

где ngOnChanges подписывается на изменение и сохраняет текущее значение и предыдущее значение