Вызов функции из другого компонента в текущий в angular без каких-либо родительских дочерних отношений
Я хочу вызвать myrole() из КомпонентДва в компонентОдин без родительского дочернего отношения.
ComponentOne является основным компонентом. После нажатия MyRoleClick() я хочу вызвать myrole() из ComponentTwo
export class ComponentOne{
MyRoleClick(){
want to call myrole() of ComponentTwo without parent child relation here.
}
}
export class ComponentTwo{
myrole(){
}
}
не родственный компонент @Narm
Похоже на родственные отношения. Каково отношение компонентов, пожалуйста, предоставьте больше информации и контекста.
Они являются независимыми компонентами, просто два компонента в разных файлах, чтобы объяснить, я написал один за другим.
Это все еще звучит как братья и сестры. Не могли бы вы предоставить код, демонстрирующий, как вы планируете использовать эти компоненты в HTML? Вы задаетесь вопросом, как это выглядит, почти идентично эта почта
Что есть в методе myrole()? Не могли бы вы уточнить немного вашего требования. Может быть, есть лучший подход к вашей проблеме, а не вызов метода в полностью изолированном компоненте.
@Narm «Возможный дубликат» может не помочь, если компоненты не включены в один и тот же файл.
Как показывает один из ответов на дубликат, все способы связи между компонентами описаны в документации: angular.io/guide/component-interaction.
Ответы 2
Я думаю, что самый чистый подход — создать службу (то есть RoleService), которую вы используете в обоих компонентах. Из вашего первого компонента вызовите метод в своей службе, создайте наблюдаемую в своей службе, для которой вы передаете значение. В вашем втором компоненте подпишитесь на этот наблюдаемый. Убедитесь, что вы предоставляете свою службу высоко в своей структуре (например, ваш app.module.ts), чтобы ваши компоненты использовали точно такой же экземпляр этого объекта службы.
Хорошим решением этой проблемы было бы создание службы, содержащей тему rxjs, чтобы первый компонент мог подписаться, а второй мог выдавать значения, чтобы сообщить другому, что он должен вызывать функцию.
ПРИМЕР
export class ComponentOne {
constructor(private myService: MyService) {}
ngOnInit() {
this.myService.subject.asObservable().subscribe(() => this.myRoleClick())
}
myRoleClick() {
// DO something
}
}
export class ComponentTwo() {
constructor(private myService: MyService) {}
myRole() {
this.myService.subject.next();
}
}
export class MyService {
subject = new Subject<void>();
}
Возможный дубликат Angular 2. Как вы вызываете функцию в родственном компоненте?