0
138
ViewsAngular ngOnInit the object property is always undefined despite the the object has value
I have an angular project and currently I am trying to set a reactive form values on ngOnInit method. I get the data with http call from a backend server. In the ngOnInit method I can monitor data on browser console; but the properties of the data object are always undefined despite the objects have this properties with proper values.
Here are the interested code blocks:
ngOnInit(): void {
this.clientService.getClientBusinessYearDetails(this.clientBusinessYearId).subscribe(data => {
console.warn(data);
console.warn(data.clientName);
this.organizationDetailsFormValues.contactPerson = data?.clientName;
this.clientProfileForm.controls.organizaionDetails.setValue(this.organizationDetailsFormValues);
});
}
You can see the details on the screen shot of browser console, the data object has a proper clientName property but it is showing up null when I try to using it in somewhere else:
The form that I want to set it's value is a reactive form which has several child form groups from inner components. I have simplified the ngOnInit method on purpose to read it easier. when I set a control of form as hardcoded it is working and the value showing up on form but when I set the control's value as above it is not showing up because the property value is undefined.
Any Idea ? I have checked this question which quite similar but my goal is not showing the property's value on console.
1 answers
Answer question0
data is an array, just assign values of first element of this array.
ngOnInit(): void {
this.clientService.getClientBusinessYearDetails(this.clientBusinessYearId).subscribe(data => {
console.warn(data);
console.warn(data[0].clientName);
this.organizationDetailsFormValues.contactPerson = data[0]?.clientName;
this.clientProfileForm.controls.organizaionDetails.setValue(this.organizationDetailsFormValues);
});
}