I have this input input img and I want to send it like an array as in this exemple array exemple How we can use Form array to solve this.
I have this inputs
<div>
<mat-form-field class='social-input lg:social-input-lg mt-8'>
<input matInput type='text' placeholder="Instagram URL">
</mat-form-field>
<mat-form-field class='social-input lg:social-input-lg mt-8'>
<input matInput type='text' placeholder="facebook URL">
</mat-form-field>
<mat-form-field class='social-input lg:social-input-lg'>
<input matInput type='text' placeholder="Linkedin URL">
</mat-form-field>
</div>
CodePudding user response:
export class AppComponent {
constructor(private fb: FormBuilder) {}
socForm: FormGroup = this.fb.group({
instagram: ["", []],
facebook: ["", []],
linkedin: ["", []]
});
ngOnInit() {
this.socForm.valueChanges
.pipe(
map((formVal: { instagram: string; facebook: string; linkedin: string }) => {
return Object.entries(formVal).reduce((accu, [fK, fV]) => {
return [...accu, { type: fK, url: fV }];
}, []);
})
)
.subscribe(console.log);
}
}