Child Component TS
import { Component, OnInit, Input, Output } from '@angular/core';
import { EventEmitter } from 'events';
export class ChildComponent implements OnInit {
@Output() OpenScheduleCall = new EventEmitter<boolean>();
onLog() {
this.OpenScheduleCall.emit(false);
}
}
parent Component HTML :
<div [(hidden)]="OpenScheduleCall">
// content
</div>
<app-schedule-call *ngIf="!!OpenScheduleCall" [prospectid]='prospectid' [(OpenScheduleCall)]="OpenScheduleCall"></app-schedule-call>
I am setting the values in child component but changes are not reflecting in parent component
You have not marked OpenScheduleCall
as an input to the child component, so first of all you need to do that. And to achieve two-way-binding with banana in the box, your @Output
needs to be the @Input
variable name, with the suffix Change
. So first mark the variable OpenScheduleCall
as @Input
to child and then change the name for @Output
variable:
export class ChildComponent implements OnInit {
@Input() OpenScheduleCall;
@Output() OpenScheduleCallChange = new EventEmitter<boolean>();
onLog() {
this.OpenScheduleCallChange.emit(false);
}
}
Now you have two-way-binding:
[(OpenScheduleCall)]="OpenScheduleCall"