Иногда я хочу вызвать метод дочернего компонента из родительского компонента или каким-то образом уведомить дочерний элемент (от родителя) о вызове чего-либо.
1-й (вызов метода дочернего компонента из родительского):
// CHILD
@Component({
selector: 'child-component',
template: '<p>child</p>'
})
class ChildComponent {
doSomething() {
console.log('I am from child')
}
}
// PARENT
@Component({
selector: 'parent-component',
template: '<child-component></child-component>',
})
class ParentComponent{
@ViewChild(ChildComponent ) child: ChildComponent;
ngAfterViewInit() {
this.child.doSomething();
}
}
2-й (уведомить дочерний компонент о вызове чего-либо):
//CHILD
export class ChildComponent implements OnInit {
@Input() notify: Subject<boolean>;
ngOnInit(){
this.notify.subscribe(v => {
console.log("I am from child");
});
}
}
//PARENT
export class ParentComp {
notify: Subject<boolean> = new Subject();
notifyChild(){
this.notify.next(true);
}
}
Вот мои вопросы:
1) Каковы минусы и плюсы 1-го способа? также, если вы вызываете дочерний метод из родителя, означает ли это, что у вас плохая архитектура для ваших компонентов или что-то еще нужно исправить?
2) Какие минусы и плюсы у 2-го способа?
3) Хорошо ли их избегать?
Я отчаянно пытаюсь найти ответы на эти вопросы (с пояснениями). Было бы здорово, если бы кто-то мог их предоставить.