如何从另一个组件中调用组件的ngOnInit

Question

我想从另一个组件调用一个组件的ngonInit()，所以我使用了BehaviorSubject。

我有一个组件a它是一个导航栏组件它在应用程序开始时被调用另一个组件b我想在每次执行组件b中的函数时重新加载组件a的ngOnInit

这是组件A:

export class A implements OnInit {
isDisabled : boolean ;
client : any;
constructor(private draftDataService : DraftDataService) {
this.draftDataService.getClient().subscribe( data =>  {this.client=data ; 
})
}
ngOnInit() {

if(this.client)
{  
this.isDisabled = false;
}
else {
this.isDisabled=true;
}
}}

这是分量B:

export class B implements OnInit, OnDestroy {
generalInfomodel : GeneralInfoModel= new GeneralInfoModel();
public selectedClient: ItemClientModel;
constructor(private draftDataService : DraftDataService){}
ngOnInit() {}
selectClient(e: any) {
if (e) {
this.selectedClient = e ;
this.generalInfomodel.client = this.selectedClient;
this.draftDataService.sendClient(this.generalInfomodel.client);
}}
}

服务如下:

export class DraftDataService {
constructor() { }
private subjectClient = new BehaviorSubject<any>('');
sendClient( client : ItemClientModel){
this.subjectClient.next(client);
}
getClient() : Observable<ItemClientModel>{
return this.subjectClient.asObservable();
}}

问题是组件A在开始时加载，所以它收到一个空字符串'客户端'，当组件B中的函数'selectClient'被执行时，组件A没有收到它，我不知道为什么!我的意思是，当我在组件A中控制客户端时，它只显示一次未定义的值!有谁能帮我解决这个问题吗?

Answer 1

简短的回答是使用ViewChild来调用组件b上的函数。

在你的HTML模板中给ComponentB一个名字:

<app-componentb #componentb></app-componentb>

在ComponentB的父组件中，执行如下操作:

@ViewChild(componentB) componentB: ComponentB

然后在ComponentB的父组件中你可以这样做:

componentB.ngOnInit()

一般来说，我不会像这样调用Angular组件层次结构方法，除非它是单元测试的一部分。我会把这个功能放到另一个方法中，从ngOnInit()和外部方法调用。

如果ComponentA不是ComponentB的父级，事情就稍微困难一些。

如果它们是同一父组件的兄弟组件，您可以从ComponentA分派一个事件来告诉父组件重置ComponentB。

或者，如果你有一个不同的架构，你可以把一个Observable放到一个在ComponentA和ComponentB中共享的服务中。ComponentA将触发next(), ComponentB将订阅以强制更改。