Angular 组件ngOnInit或构造函数在单击按钮加载时执行多次

我有一个功能，我在点击按钮时加载一个组件，为此我使用了

ngIf

指令，如下所示：

MainComponent.html

<app-sub-component *ngIf = "showSubWizard | async" (boolAddSubClick)="addSubQuestion($event)"></app-sub-component>

主组件

showSubComponent: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);

//button click method
subComponentLoadBtn(){
  this.showSubComponent.next(true)
}

showSubComponent:BehaviorSubject=新的BehaviorSubject（false）；
//按钮点击法
子组件LoadBTN（）{
this.showSubComponent.next（true）
}

我在

子组件的
ngOninit（）
中添加了
console.log
，当单击按钮时，它显示
console.log
5次

我之前使用了一个普通的布尔变量，但后来我看到有人建议使用行为主体，这就是我现在看到的，但我仍然遇到了同样的问题。我将我的
ngOninit
代码移动到
SubComponent
构造函数，但它仍然被加载了5次

问题是，在我的
子组件
的
ngOninit
中，我有几个api调用，它们被执行了5次。
你会设置一个stackblitz.com吗？你的意思是，如果你在看到
ngOninit
调用了5次后单击按钮，或者您是否隐藏/显示组件
ngOnInit
每次显示时都会调用它？@Vlad274是，因此如果我单击按钮加载组件（通过将ngIf中的变量设置为true），ngOninit被调用了5次。@Bill Cheng明天会尝试这样做，但我看到很多人发布了这个问题，给出的解释是ngIf包含一个表达式，为了监视有效值的变化，angular执行了多次。虽然提供的解决方案对我不起作用。您是否在ngAfterViewInit（）中尝试过它？您是否会设置stackblitz.com？您的意思是，如果您看到调用了5次的
ngOnInit
，然后单击按钮，或者您隐藏/显示组件
ngOnInit
，每次显示时都会调用它？@Vlad274 yes，因此，如果我单击按钮加载组件（通过将ngIf中的变量设置为true），ngOninit会被调用5次。@Bill Cheng明天会尝试这样做，但我看到很多人发布了这个问题，给出的解释是ngIf包含一个表达式，为了监视有效性更改，angular会多次执行它。但提供的解决方案对我不起作用。您在ngAfterViewInit（）中尝试过吗？