CODEWITHSUNDEEP
angularionic-framework
viiskis
viiskis

Reputation: 164

How to add additional fields to ngForm before submit?

How can I add some additonal fields to my form right before it goes out?

this.forma = { 'date': this.selectedDate };

form.ts

onSubmit(f: NgForm) {
    console.log(f);
}

form.html

<form (ngSubmit)="onSubmit(forma)" #forma="ngForm" method="post">
<ion-list>
  <ion-item>
    <ion-label floating>First name, last name*</ion-label>
    <ion-input type="text" value="" minlength="8" name="subject" ngModel #subject="ngModel"></ion-input>
  </ion-item>

Upvotes: 0

Views: 1482

Answers (1)

Yerkon
Yerkon

Reputation: 4798

How can I add some additonal fields to my form right before it goes out?

If you want add additional fields to NgForm, you only can add FormControl/FormGroup of NgModel type, which means you need to have some element in template with ngModel directive. Example:

class SomeComponent{

@ViewChild('myControl') myControl: NgModel;
...
onSubmit(f: NgForm){
   f.addControl(myControl);
}
...
}

Component template: 

    <input #myControl="ngModel" [name]="formInputName" [id]="formInputName" type="text" [(ngModel)]="searchValue">

But you can add fields to FormGroup. This case may useful when you need render different control types dynamically.

Code example

Official guide

Update: fix formControlName bindings

Upvotes: 1

Related Questions