如何使用@output从子节点到父节点触发布尔值

时间:2017-07-26 09:37:01

标签: angular output

嗨角社区,

我想使用@Output触发事件来隐藏或打开/关闭包含其他组件的div。这很简单,但我以前从不使用EventEmitter,所以我想在调用hideDem时隐藏或打开/关闭div取决于来自child.ts的其他propret.ts

child.html:

 <img type="button" label="Click" (click)="hideDem()" id="foldup" src="./assets/img/fold_up_blacksmall.png"/>

child.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);
  }
}

parent.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-->

1 个答案:

答案 0 :(得分:2)

[ 1.  1.  1.  1.]  [ 1.  1.  1.  1.]  0.0
[ 1.  1.  1.  1.]  [ 1.  1.  1.  3.]  1.0
[-1.  1.  1.  1.]  [ 1.  1.  1.  3.]  1.33333
[-1. -1.  1.  1.]  [ 1.  1.  1.  3.]  2.0
[-1. -1. -1.  1.]  [ 1.  1.  1.  3.]  4.0
[-1. -1. -1. -1.]  [ 1.  1.  1.  3.]  nan

是无效的标记。 [hidden]="(close)=hideDem($event)" 不能在另一个绑定的表达内。

(close)