为什么我可以同时选择两个单选按钮？

Question

为什么我可以同时选择两个单选按钮？

  <form #form="ngForm">
    {{ poll.counter1 }} votes <input type="radio" id="{{ poll.choice1 }}" value="{{ poll.choice1 }}" (click)="onChoice1(form)">{{ poll.choice1 }}
    <br>
    {{ poll.counter2 }} votes <input type="radio" id="{{ poll.choice2  }}" value="{{ poll.choice2 }}" (click)="onChoice2(form)">{{ poll.choice2 }}
  </form>

Answer 1

如果您只想选择一个，则必须为两个单选按钮指定相同的名称。

<form #form="ngForm">
    {{ poll.counter1 }} votes <input type="radio" name="my_radio" id="{{ poll.choice1 }}" value="{{ poll.choice1 }}" (click)="onChoice1(form)">{{ poll.choice1 }}        
    {{ poll.counter2 }} votes <input type="radio" name="my_radio" id="{{ poll.choice2  }}" value="{{ poll.choice2 }}" (click)="onChoice2(form)">{{ poll.choice2 }}
</form>

你可以在这里试试：

＆＃13;

＆＃13;

<label>Radio A</label>
<input type="radio" name="foo">
<label>Radio B</label>
<input type="radio" name="foo">

<h2>Without the same name</h2>
<label>Radio X</label>
<input type="radio">
<label>Radio Y</label>
<input type="radio">

＆＃13;

＆＃13;

＆＃13;