1 回答

TA貢獻(xiàn)2036條經(jīng)驗(yàn) 獲得超8個(gè)贊
這些不是復(fù)選框而是單選按鈕。假設(shè)您確實(shí)需要單選按鈕(在您的情況下它看起來像這樣,因?yàn)樗瞧渲兄唬?,則需要完成一些事情。
您可以使用 1 個(gè)屬性來實(shí)現(xiàn)此目的,而不是使用 2 個(gè)屬性來指示選擇了哪個(gè)選項(xiàng)。
所以
this.otpEmailValue = 1;
this.otpCellValue = 0;
成為
this.contact = 'email'; // This line is now equivalent to the ones above
在模板中,單選按鈕輸入需要具有相同的名稱才能充當(dāng) 1 個(gè)輸入而不是 2 個(gè)輸入,因?yàn)楫吘刮覀冎幌脒x擇 1 個(gè)選項(xiàng)。該ngModel指令現(xiàn)在指向我們想要綁定的值,在我們的例子中是contact。最后,該值應(yīng)該是靜態(tài)的。當(dāng)綁定的屬性值ngModel與單選按鈕之一的值匹配時(shí),它將選擇它。
因此,在所有這些更改之后,我們得到以下結(jié)果。
<input type="radio"
name="contact-option"
id="1"
class="with-gap"
[(ngModel)]="contact"
value="cell"> Cell
<input type="radio"
name="contact-option"
id="2"
class="with-gap"
[(ngModel)]="contact"
value="email"> Email
添加回答
舉報(bào)