Angular 角度-如何根据每个值更改FormBuilder中动态创建的输入的样式？

我试图将插入动态创建的输入中的文本变为红色（按按钮的数量），但我无法正确执行。在这种情况下，我不知道如何访问输入值。 我想根据以下条件更改文本：如果插入的数字大于表单中的其他输入，则其颜色变为红色

这是html

<form [formGroup]="formulario">
  <label>
    Capacidad
    <input type="text" formControlName="capacidad" />
  </label>
  <label>
    Max. Casas
    <input type="text" formControlName="maxcasas" />
  </label>
  <div formArrayName="pesos">
    <button (click)="addPeso()">Añadir peso</button>
    <button (click)="deleteAllPesos()">Resetear</button>
    <div *ngFor="let peso of pesos.controls; let i = index" [formGroupName]="i">
      <label>
        Peso:
        <input [style.color]="<<<<value bigger than formulario.capacidad ? "red" ; "black">>>>> type="number"  formControlName="peso" />
      </label>
      <label>
        Nombre:
        <input type="text" formControlName="nombre" type="text" />
      </label>
      <button (click)="deletePeso(i)">Borrar</button>
    </div>
  </div>
</form>

---

与您通过编程进行访问的方式相同 这formulario.get（“capacidad”）//FormControl

<form [formGroup]="formulario">
  <label>
    Capacidad
    <input type="text" formControlName="capacidad" />
  </label>
  <label>
    Max. Casas
    <input type="text" formControlName="maxcasas" />
  </label>
  <div formArrayName="pesos">
    <button (click)="addPeso()">Añadir peso</button>
    <button (click)="deleteAllPesos()">Resetear</button>
    <div *ngFor="let peso of pesos.controls; let i = index" [formGroupName]="i">
      <label>
        Peso:
        <input [style.color]="formulario.get('pesos').get(i).get('peso').value > formulario.get("capacidad").value ? "red" ; "black" type="number"  formControlName="peso" />
      </label>
      <label>
        Nombre:
        <input type="text" formControlName="nombre" type="text" />
      </label>
      <button (click)="deletePeso(i)">Borrar</button>
    </div>
  </div>
</form>
```

己酸
马克斯·卡萨斯
阿尼亚迪尔比索
重置
比索：
与您通过编程进行访问的方式相同
这formulario.get（“capacidad”）//FormControl

<form [formGroup]="formulario">
  <label>
    Capacidad
    <input type="text" formControlName="capacidad" />
  </label>
  <label>
    Max. Casas
    <input type="text" formControlName="maxcasas" />
  </label>
  <div formArrayName="pesos">
    <button (click)="addPeso()">Añadir peso</button>
    <button (click)="deleteAllPesos()">Resetear</button>
    <div *ngFor="let peso of pesos.controls; let i = index" [formGroupName]="i">
      <label>
        Peso:
        <input [style.color]="formulario.get('pesos').get(i).get('peso').value > formulario.get("capacidad").value ? "red" ; "black" type="number"  formControlName="peso" />
      </label>
      <label>
        Nombre:
        <input type="text" formControlName="nombre" type="text" />
      </label>
      <button (click)="deletePeso(i)">Borrar</button>
    </div>
  </div>
</form>
```


己酸
马克斯·卡萨斯
阿尼亚迪尔比索
重置
比索：
与其他答案类似，检查循环中特定表单控件的值，您可以通过以下方法进行检查：

[style.color]=“比索.at（i）.get（'peso'）.value>formulario.get（'capacidad'）。value？'red'：'black'”


编辑：但您也可以执行
peso.controls[i].controls.peso.value
，但我喜欢使用
at
和
get
，与其他答案类似，检查循环中特定表单控件的值，您可以通过以下方法执行：

[style.color]=“比索.at（i）.get（'peso'）.value>formulario.get（'capacidad'）。value？'red'：'black'”


编辑：但你也可以做
peso.controls[i].controls.peso.value
，但我喜欢在
at
和
get
，
我认为我的答案应该有效，但如果不放一个stackblitz，我可以签出它我认为我的答案应该有效，但如果不放一个stackblitz，我可以签出itEdit:Worked。我不太明白为什么用at（x）代替[x]，跟“get”一样。但是谢谢你的帮助。
get
只是一个（更干净的）快捷方式，而不是使用
控件来遍历<代码>在
我们使用，因为它是一个正式数组。我们也可以使用
.controls
遍历数组，但这更干净，至少在我看来：）但我理解你所说的混淆-formarray与“普通”数组。因此，你也可以使用
peso.controls[I].controls.peso.value
但我认为使用
at
和
get
更干净。但是你的选择：）编辑：有效。我不太明白为什么用at（x）代替[x]，跟“get”一样。但是谢谢你的帮助。
get
只是一个（更干净的）快捷方式，而不是使用
控件来遍历<代码>在
我们使用，因为它是一个正式数组。我们也可以使用
.controls
遍历数组，但这更干净，至少在我看来：）但我理解你所说的混淆-formarray与“普通”数组。因此，你也可以使用
peso.controls[I].controls.peso.value
但我认为使用
at
和
get
更干净。但是你的选择：）