html中單選框用法

html中單選框用法如下，checked用來選中默認(rèn)的單選項(xiàng)：

<input type="radio" name="sex" value="male" checked>Male
<input type="radio" name="sex" value="female">Female

  sex:string="male"
   <input type="radio" name="sex" [(ngModel)]="sex" value="male">Male
    <input type="radio" name="sex" [(ngModel)]="sex" value="female">Female

選中某單選框后觸發(fā)事件

有三種方法

1.添加(click)事件，#male和#female是ng2中的模板變量

<input type="radio" name="sex" (click)="print(male.value)" value="male" #male checked>male
<input type="radio" name="sex" (click)="print(female.value)" value="female" #female>female

2 萬能的 ngModel和ngModelChange方法

當(dāng)使用ngModel時(shí)，如果用綁定的sex傳值必須使用ngModelChange，因?yàn)檫x中單選項(xiàng)后，(click)執(zhí)行要早于ngModelChange，所以此時(shí)(click)中傳入的值還是未綁定的舊值；如果使用模板變量則不存在這個(gè)問題。

<input type="radio" name="sex" [ngModel]="sex" (ngModelChange)="sex=$event;print(sex)" value="male">Male
<input type="radio" name="sex" [ngModel]="sex" (ngModelChange)="sex=$event;print(sex)" value="female">Female

3.原生的change方法也可以

以上就是angular中radio單選的問題解決demo的詳細(xì)內(nèi)容，更多關(guān)于angular radio單選的資料請關(guān)注其它相關(guān)文章！