是否有任何方法来隐藏/显示div上的子组件，如果鼠标单击父组件屏幕?

Question

我是angular的新手。我有一个div，它是在子组件和显示/隐藏的基础上的按钮单击事件:

孩子:

@Component({
selector: 'child-component',
templateUrl: 'child-component.html',
styleUrls: ['child-component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
})
@Input() showFilters = false;
// button click event
openFilter() {
this.showFilters = !this.showFilters;
}

子类HTML:

<div class="filterDiv" *ngIf="showFilters">
</div>

父组件:

<child-component> [showFilters]="showFilters" </child-component>

Answer 1

语法应该是:

<child-component [showFilters]="showFilters"></child-component>