我是 Angular 新手,我在驗證用戶性別時遇到問題,默認情況下未設定性別,并且表單用于更新用戶資料,也許用戶將設定他的性別并再次回傳以更新別的東西,現在已經設定了用戶性別,所以想根據用戶資料選擇它,所以在我的例子中 data.general.gender 是男性,但沒有選擇兩者都沒有選擇
HTML
this.instructorGeneralForm = this._formBuilder.group({
gender: ['', [Validators.required]]
代碼
<div class="demo-inline-spacing">
<div class="custom-control custom-radio">
<input type="radio"
id="gender_male"
name="gender"
formControlName="gender"
class="custom-control-input"
[checked]="data.general.gender === 'Male'" [value]="'Male'"
/>
<label class="custom-control-label" for="gender_male">I'm Male</label>
</div>
<div class="custom-control custom-radio">
<input type="radio"
id="gender_female"
name="gender"
formControlName="gender"
class="custom-control-input"
value="Female"
[checked]="data.general.gender === 'Female'" [value]="'Female'"
/>
<label class="custom-control-label" for="gender_female">I'm Female</label>
</div>
<div *ngIf="submitted && generalForm.gender.errors" class="invalid-feedback"
[ngClass]="{ 'd-block': submitted && generalForm.gender.errors }">
<div *ngIf="generalForm.gender.errors.required">Gender is required</div>
</div>
</div>
uj5u.com熱心網友回復:
有條件地設定checked屬性只會反映checked單選框的狀態。狀態的這種變化radio不會反映在genderformControl 中。
為了解決這個問題,你設定了表單的 patchValue
this.instructorGeneralForm.patchValue({
gender: data.general.gender,
})
[checked]并從輸入單選框中洗掉屬性系結。
堆疊閃電戰
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/515375.html
