Parent.component.html
<app-child [activeUser]="activeUser" *ngIf="eceConfirm && activeUser"></app-child>
Parent.component.ts During the initialization of the component, the getAllEmployees method is called to fetch the employee data, and the data of the 0th index is passed to the child component using @Input() activeUser.
getAllEmployees() {
this.service
.getCommonEmployeesDetail(this.user["uid"], this.selectedRatingCycleId)
.subscribe((res) => {
this.userList = res;
this.changeUser(this.userList[0]);
});
}
changeUser(user) {
console.log("user", user);
this.activeUser=user;
}
Child.component.ts
The child component is implemented with the changeDetection.Onpush strategy. Once the activeUser data is received, it triggers the changeChildUser() method to make a request and assign the fetched data to this.cycleData.
An issue encountered is 1. When attempting to display {{cycleData.Englishmarks}} in the HTML page, it does not refresh. Although checking this.cycleData in the console shows the correct value.
If you have any insights on what might be causing this issue, please feel free to share. Your input is valuable. Thank you
@Input() activeUser: BpuData;
ngOnChanges(changes: SimpleChanges) {
this.changeChildUser();
}
changeChildUser() {
this.chapterService.getcycle(this.activeUser).subscribe(response =>{
this.cycleData=response;
});
}