無線電輸入在角度 7 中無法正常工作

Question

我得到了無線電輸入，使用結構指令 ngFor 呈現。

    <form>
      <label *ngFor="let user of staffMembers" class="stuff" for="user.username"> 
          {{user.username}}
          <input type="radio" [name]="user.username" [value]="user.username"> 
      </label>
    </form>

我的輸入正確，但我可以檢查多個字段，例如復選框。 這不是無線電輸入的默認行為。

Answer 1

因為您正在為每一行創建一個新的無線電組，而不是一個新的無線電選項。 輸入 [name] 是無線電組的名稱，而不是選項。

 <form>
  <label *ngFor="let user of staffMembers" class="stuff" for="staffMembers1"> 
      {{user.username}}
      <input type="radio" id="staffMembers1" name="staffMembers" [value]="user.username"> 
  </label>
</form>

Answer 2

名稱不應該是唯一的以獲得正常行為，否則，它只是只有一種可能性的收音機。

<input type="radio" name="user" [value]="user.username"> 

Answer 3

您需要為所有無線電輸入指定相同的名稱：

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio

現在似乎每個無線電輸入都有不同的輸入，因為 user.username 總是不同的。