For my Angular-12 project, I am currently working on implementing a dynamic input fields FormArray within a Reactive Form to handle updates. Below is the code snippet:
Interface:
export interface IResponse<T> {
message: string;
error: boolean;
code: number;
results: T;
}
export interface IEmployees {
employees: IEmployee[];
}
export class EmployeeResponse {
results!: { employee: IEmployee; };
}
export interface IEmployee {
id?: number;
current_residential_address?: string;
employeephones?: IContact[];
}
export interface IContact {
id?: number;
phone_number: string;
phone_type_id?: number;
phonetypes?: {id:number,type_name:string};
is_primary_contact_number?: boolean;
}
Service:
getContactById(id: number): Observable<EmployeeResponse> {
return this.http.get<EmployeeResponse>(this.api.baseURL + 'company/employees/fetchbyid/' + id, this.httpOptions);
}
public updateContact(id: number, employee: IEmployee): Observable<any> {
return this.http.post(this.api.baseURL + 'employees/contact/update/' + id, employee, this.httpOptions);
}
Component:
(component code here...)
I have encountered an issue where only the single data field (current_residential_address) gets updated upon submission, while the array (contacts) does not reflect the changes. How can I resolve this issue?
Any help would be appreciated.