CODEWITHSUNDEEP
angularangular4-forms
Gallo
Gallo

Reputation: 185

Data binding of an input with a predefined value in Angular

I wanna have a predefined input form that has the value for the email provider. I case is not modify, on submit, it should upload to firebase the gmail.com value but it dosen't upload anything unless I delete the value from the input form and rewriting. 

<input class="button" value="gmail.com" formControlName="emailProvider">

Can someone tell what should I modify to work?

Upvotes: 1

Views: 494

Answers (2)

Zach Newburgh
Zach Newburgh

Reputation: 564

I think this might do the trick:

1) Remove the value property from your input;

2) When creating the emailProvider FormControl in your FormGroup instantiation, set the former's initial value to "gmail.com"

emailProvider: new FormControl('gmail.com')

By doing so, the initial value of the FormControl will be 'gmail.com' and should be able to be overridden by the user's input.

Upvotes: 2

Tomasz Kula
Tomasz Kula

Reputation: 16837

Template Driven Forms:

<input class="button" [(ngModel)]="value">

class MyComponent {
  value = 'gmail.com'
}

Reactive Forms:

<input class="button" [formControl]="ctrl">

class MyComponent {
  ctrl = new FormControl('gmail.com');
}

Upvotes: 2

Related Questions