繫結到無線電輸入

基本無線電

export class MyViewModel {
    favoriteColor = null;
    colors = ['Red', 'Yellow', 'Pink', 'Green', 'Purple', 'Orange', 'Blue'];
}

<template>
  <label repeat.for="color of colors">
    <input type="radio" name="colors" value.bind="color" checked.bind="favoriteColor" />
    ${color}
  </label>
</template>

物件陣列的無線電

export class MyViewModel {
    people = [];
    selectedPerson = null;
    
    constructor() {
        this.people = [
            {name: 'John Michaels'},
            {name: 'Gary Stevens'},
            {name: 'Carrie Smitch'},
            {name: 'Jesus Wohau'}
        ];
    }
}

<template>
  <label repeat.for="person of people">
    <input type="radio" name="person" model.bind="person" checked.bind="selectedPerson" />
    ${person.name}
  </label>
</template>

帶有布林值的無線電

export class MyViewModel {
    agreeToTerms = null;
}

<template>
  <label><input type="radio" name="terms" model.bind="null" checked.bind="agreeToTerms" />No Answer</label>
  <label><input type="radio" name="terms" model.bind="true" checked.bind="agreeToTerms" />Yes</label>
  <label><input type="radio" name="terms" model.bind="false" checked.bind="agreeToTerms" />No</label>
</template>