Reputation: 59
I have an app-file-actionscomponent which emit to
propertyEvent if dialog res is true then app-general-details
component which has an output and then app-general-details
is rendered by the parent component which is app-main-details
and then on app-main-details
I have an event that gets the ouput from app-general-details
which is
inspectionPropertyGeneralDetailsEvent(event:any)
and then everytime this method is called it will pass an input to app-property-details
and then app-property-details
will detect that changes.
But the issue is that ngOnchanges only triggered and detected once even though the input has been updated. Any idea guys ?
#app-file-actions(ts)
@Output() propertyEvent = new EventEmitter<any>();
add() {
const confirmDialog = this.dialog.open(AddPropertyDialogComponent, {
autoFocus: false
});
confirmDialog.afterClosed().subscribe((res) => {
if (res) {
this.propertyEvent.emit(res);
}
});
}
#app-general-details (html)
<app-file-actions (propertyEvent)="propertyEvent($event)"></app-file-actions>
#app-general-details (ts)
@Output() inspectionPropertyGeneralDetailsEvent = new EventEmitter<any>();
propertyEvent(event:any){
this.inspectionPropertyGeneralDetailsEvent.emit(event);
}
#app-main-details(html)
<div>
<app-general-details (inspectionPropertyGeneralDetailsEvent)="inspectionPropertyGeneralDetailsEvent($event)"></app-general-details>
<app-property-details [hasChanges]="hasChanges"></app-property-details>
</div>
#app-main-details(ts)
inspectionPropertyGeneralDetailsEvent(event:any) {
this.hasChanges= event;
}
#app-property-details (ts)
@Input() hasChanges: boolean;
ngOnChanges(changes: SimpleChanges) {
if(changes.hasChanges&& changes.hasChanges.currentValue) {
console.log('here')
this.getData();
}
Upvotes: 0
Views: 235