Cómo establecer el valor de control de formulario en Angular
this.form.controls['nameOfTheField'].setValue(theValue);
Careful Cow
this.form.controls['nameOfTheField'].setValue(theValue);To set all FormGroup values use, setValue:
this.myFormGroup.setValue({
formControlName1: myValue1,
formControlName2: myValue2
});
To set only some values, use patchValue:
this.myFormGroup.patchValue({
formControlName1: myValue1,
// formControlName2: myValue2 (can be omitted)
});/*
Technologies Used
Find the technologies being used in our example.
Angular 11.0.3
Using setValue()
*/
//Here we will provide simple use of FormControl.setValue() method. In our code we have initialized a FormControl and we have a setter method to set value as 'India'.
countryName = new FormControl();
setCountryName() {
this.countryName.setValue('India');
}
//Find the HTML template code.
<input [formControl]="countryName">
<button type="button" (click)="setCountryName()">Set Country Name</button>
{{countryName.value}}
//On click of button, text box and countryName.value will display value as 'India'.
//3. Using setValue() with Options
//We can use FormControl.setValue() with configuration options as following.
this.cityName.setValue('Varanasi', {
onlySelf: false,
emitEvent: true,
emitModelToViewChange: true,
emitViewToModelChange: true
});
//Find the example where we are setting the emitModelToViewChange value as false.
cityName = new FormControl();
setCityName() {
this.cityName.setValue('Varanasi', {
emitModelToViewChange: false
});
}
//Find the HTML template code.
<input [formControl]="cityName">
<button type="button" (click)="setCityName()">Set City Name</button>
{{cityName.value}}
//When we call setValue() by clicking the button, this value in text box will not change but cityName.value will change.