I have an app-file-actionscomponent which emit topropertyEvent 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();
 }

CodePudding user response：

I'm sorry but I don't have the reputation to add a comment so I must do like this...

Can you maybe add the app-general-details(html) file so we can see what event is actually causing the event emitter to fire?

Also check if the actual value of the event actually changes more than once... If you assign the same value twice to the event parameter, ngOnChanges wont fire again, so maybe that's your problem.

If else, please refer to this question