effect description: when the screen size is smaller than 768px, the chat box is hidden first, click the chat button to show the chat box, click the close button to close the chat box
parent component code:
parent component binding event:
< li class= "list-group-item" >
<button class="btn btn-block btn-primary" *ngIf="show" (voted)="onVoted($event)"></button>
</li> declarations and methods in the parent component class file:
show = true;
onVoted (agreed: boolean) {
this.show = agreed;}
subcomponent code:
subcomponent binding event:
< button class= "btn btn-primary" (click) = "vote ()" > close < / button >
methods in the subcomponent class file:
@ Output () voted = new EventEmitter < boolean > ();
vote () {
this.voted.emit(false);}