Example
Basic Radios
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>
Radios With Object Arrays
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>
Radios with a Boolean
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>
