如何解决FormControl数字值已设置,但直到触摸后才显示
我正在尝试使用要编辑的模型中的数据填充表单输入字段。文本输入字段可以正常工作,但是在我单击它们之前,数字字段保持为空,在我单击它们以及所有以前的数字字段之前,某些保持不变...可能导致此问题的原因是什么? 这是html:
<form [formGroup]="servis.editCarFrom" style="width: 320px;">
<div class="form">
<div class="form">
<div>
<label for="marka">Marka:</label>
<input id="marka" formControlName="marka" class="form-control" value="{{servis.editCarForm.get('marka').value}}">
</div>
</div>
<div class="form">
<div>
<label for="model">Model:</label>
<input id="model" formControlName="model" class="form-control" value="{{servis.editCarForm.get('model').value}}">
</div>
</div>
<div class="form">
<div>
<label for="brojMesta">Broj mesta:</label>
<input type="number" id="brojMesta" formControlName="brojMesta" class="form-control" value="{{servis.editCarForm.get('brojMesta').value}}">
</div>
</div>
<div class="form">
<div>
<label for="godiste">Godiste:</label>
<input type="number" id="godiste" formControlName="godiste" class="form-control" value="{{servis.editCarForm.get('godiste').value}}">
</div>
</div>
<div class="form">
<div>
<label for="cena">Cena:</label>
<input type="number" id="cena" formControlName="cena" class="form-control" value="{{servis.editCarForm.get('cena').value}}">
</div>
</div>
<div class="form">
<div>
<label for="brzaRezervacija">Brza rezervacija:</label>
<input type="checkbox" id="brzaRezervacija" formControlName="brzaRezervacija" class="form-control" value="{{servis.editCarForm.get('brzaRezervacija').value}}">
</div>
</div>
<div>
<label for="tip">Tip vozila:</label>
<select id="tip" formControlName="tip" class="form-control">
<option selected value>{{servis.editCarForm.get('tipVozila').value}}</option>
<option *ngFor="let t of GetTipovi()">
{{t}}
</option>
</select>
</div>
</div>
<div style="display: inline;">
<button (click)="Save()">Sacuvaj</button>
<button style="float: right;" (click)="Nazad()">Nazad</button>
</div>
</form>
这是我设置控制值的地方:
InitEditCarForm(kola: any) {
let naziv = kola.naziv.split('-');
let marka = naziv[0];
let model = naziv[1];
let tip = TipVozila[kola.tipVozila];
this.editCarForm.controls.marka.setValue(marka);
this.editCarForm.controls.model.setValue(model);
this.editCarForm.controls.godiste.setValue(kola.godiste);
this.editCarForm.controls.cena.setValue(kola.cena);
this.editCarForm.controls.brojMesta.setValue(kola.brojMesta);
this.editCarForm.controls.brzaRezervacija.setValue(kola.brzaRezervacija);
this.editCarForm.controls.tipVozila.setValue(kola.tipVozila);
this.editCarForm.markAllAsTouched();
}
此方法非常慢,我必须在页面加载后等待几秒钟,然后才更新值,而并非所有值都被更新。有一个更好的方法吗?如果不能,如何正确更新数字字段,以便在页面加载后自动显示其预期值?
解决方法
您可以在声明表单组时初始化值
select avg(case when val = 'complete' then 1.0 else 0 end) as complete_ratio
如果要更新表单组的值,则可以直接在表单组上使用formGroup = new FormGroup({
firstInput: new FormControl(value1),secondInput: new FormControl(value2)
});
或setValue
。 patchValue
要求您更新所有输入。因此,如果您有一个包含三个表单控件的“从”组,并且只想更新两个控件,则必须使用`patchValue。例如:
setValue
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。