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

Question

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

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

Код, который я пробовал:

Родительский компонент:

@ViewChildren(EditorComponent) editor: EditorComponent;

ngAfterViewChecked(){
  console.info(this.editor.isDirty);
}

, но это всегда возвращает undefined.

В дочернем компоненте я упомянул isdirty как false по умолчанию.

Не могли бы вы подсказать мне, как поступить с этим.

Answer 1

Вы можете использовать @ViewChild:

@ViewChild(EditorComponent) editor: EditorComponent;

Online Demo

Answer 2

Вы можете использовать @Output Decorator для отправки данных от дочернего к родительскому компоненту.

В дочернем компоненте создайте источник событий и передайте значение в источник событий.

 @Output() childValueChange = new EventEmitter();

 this.childValueChange.emit(value);

В родительском компоненте HTML

<app-parent-component (childValueChange)='save($event)'></app-parent-component>

Component.ts

save(event){
  // Here you will get  the value which child has emitted
  console.log(event);
}