동적으로 생성 된 입력 (버튼을 눌렀을 때)에 삽입 된 텍스트를 빨간색으로 만들려고하는데 제대로 이해할 수 없습니다. 이 경우 입력 값에 액세스하는 방법을 모르겠습니다. 입력 한 숫자가 폼에 입력 된 다른 숫자보다 크면 색상이 빨간색이되는 조건에 따라 텍스트를 변경하고 싶습니다.
이것은 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>
이것은 TS의 관련 부분입니다
public formulario = this.fb.group({
capacidad: ["5"],
maxcasas: ["3"],
pesos: this.fb.array([
this.fb.group({
peso: this.fb.control(""),
nombre: this.fb.control("")
})
])
});
get pesos() {
return this.formulario.get("pesos") as FormArray;
}
다른 답변과 마찬가지로 루프에서 특정 양식 컨트롤의 값을 확인하십시오. 다음과 같이 할 수 있습니다.
[style.color]="pesos.at(i).get('peso').value > formulario.get('capacidad').value ? 'red' : 'black'"
편집 :하지만 당신은 또한 할 수 pesos.controls[i].controls.peso.value
있지만 사용 at
하고 싶습니다 get
.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다