嗨,有角的社区,
我想使用 @Output 触发一个事件来隐藏或打开/关闭包含其他组件的 div。这很简单,但我以前从未使用过 EventEmitter,所以我希望当调用 hideDem 时,它会根据来自 child.ts 的其他属性隐藏或打开/关闭 div
孩子.html:
<img type="button" label="Click" (click)="hideDem()" id="foldup" src="./assets/img/fold_up_blacksmall.png"/>
子.comp.ts:
@Output() open: EventEmitter<any> = new EventEmitter();
@Output() close: EventEmitter<any> = new EventEmitter();
public hideDem(): void {
this.hideMePartially = !this.hideMePartially;
if (this.hideMePartially) {
this.open.emit(true);
} else {
this.close.emit(false);
}
}
父级.comp.html
<div class="daydetail">
<div><my-daydetail [showMePartially]="showVar" ></my-daydetail></div>
<div [hidden]="(close)=hideDem($event)">
<div>
<app-pie-chart [minifiedMe]="hideMeup" ></app-pie-chart>
</div>
<div>
<app-fonctionnaly [minifiedMe]="hideMeup"></app-fonctionnaly>
</div>
<div>
<app-my-verticalchart [minifiedMe]="hideMeup" ></app-my-verticalchart>
</div>
<div>
<app-dysfonction [showMePartially]="hideVar"></app-dysfonction>
</div>
</div> <!-- End of hidden-->
</div> <!-- End of daydetail-->
[hidden]="(close)=hideDem($event)"
是无效标记。(close)
不能位于另一个绑定的表达式内。
<my-daydetail [showMePartially]="showVar"
(close)="isHidden = true" (open)="isHidden = false"></my-daydetail>
<div [hidden]="isHidden">
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)