aurelia 绑定到选择元素
示例
字符串数组
在选择下拉列表中选择一个值并提供字符串数组时，所选值将作为字符串绑定到选择元素的value属性，我们可以使用字符串插值显示该字符串。
export class MyViewModel {
animals = [];
favouriteAnimal = null;
constructor() {
this.animals= [
'Cat',
'Dog',
'Fish',
'Rabbit',
'Tiger',
'Bat'
];
}
}<template>
${favouriteAnimal}
<select name="animals" value.bind="favouriteAnimal">
<option repeat.for="animal of animals">${animal}</option>
</select>
</template>对象数组
与上面的示例不同，当提供对象数组时，在下拉列表中选择一个值时，绑定到该特定选项的模型就是所提供的对象。
export class MyViewModel {
animals = [];
favouriteAnimal = null;
constructor() {
this.animals= [
{label: 'Cat', value: 99},
{label: 'Dog', value: 493},
{label: 'Fish', value: 934839200},
{label: 'Rabbit', value: 8311},
{label: 'Tiger', value: 22},
{label: 'Bat', value: 3711}
];
}
}<template>
<p>Favourite animal ID: ${favouriteAnimal.value}</p>
<p>Favourite animal name: ${favouriteAnimal.label}</p>
<select name="animals" value.bind="favouriteAnimal">
<option repeat.for="animal of animals" model.bind="animal">${animal.label}</option>
</select>
</template>
热门推荐
10 对患者生日祝福语简短
11 结婚祝福语简短装备
12 周岁祝福语学生文案简短
13 订婚领证祝福语简短精辟
14 导师获奖祝福语大全简短
15 新婚购房祝福语简短精辟
16 牛年祝福语简短的爱人
17 送芒果的祝福语简短
18 送给学长毕业祝福语简短