Cómo establecer el valor dinámico para formControl en angular 7

Solución:

Puedes usar SetValue método de FormControl:

setValue():

Establece un nuevo valor para el control de formulario.

Entonces puedes usarlo como:

this.userForm.controls['TemplateJson'].setValue(this.data.TemplateJson);

Stackblitz_Demo

He respondido una pregunta similar aquí que tiene una mejor explicación con ejemplos.

La configuración o actualización de los valores de Control de formularios de formularios reactivos se puede realizar utilizando ambos patchValue y setValue. Sin embargo, podría ser mejor usar patchValue en algunos casos.

patchValue no requiere que todos los controles se especifiquen dentro de los parámetros para actualizar / establecer el valor de sus controles de formulario. Por otro lado, setValue requiere que se completen todos los valores de Control de formulario y devolverá un error si alguno de sus controles no está especificado dentro del parámetro.

En este escenario, usaremos patchValue para actualizar los valores en userForm.

Si las propiedades en TemplateJson son las mismas que las de FormControlNames, puede hacerlo de esta manera:

this.userForm.patchValue(this.data) 

Si los nombres son diferentes,

this.userForm.patchValue({
  property1: this.data.bbb
  property2: this.data.aaa
  .
  .
}) 

Tuve un problema similar en el que intenté usar ‘setValues’ con ‘this.class.attribute’ después de mi suscripción y tuve un error de “no se puede leer el valor indefinido”. Resultó que tienes que usar setValue dentro de la suscripción.

 //My Get method
 getX(): void {
    const id = +this._route
    .snapshot.paramMap.get('id');
    this._xService.getX(id)
    
    //Now my subscribe
    .subscribe(x =>  {
      this.x = x;

        //And my setValue inside my subscribe
        this.nameOfYourForm.setValue({
          formAttribute1: this.x.Attribute1,
          //The x attribute should match the name in the API / database and not the name in your class
       })
    })
  }

Espero que esto ayude a alguien.

---

---

Utiliza Nuestro Buscador