Question

我有以下代码：

的javascript：

export class App {
  values = [
    {id: 0, text:'Text 1'},
    {id: 1, text:'Text 2'},
    {id: 2, text:'Text 3'}
  ];

  obj = {
    selected: 2
  };
}

HTML：

<template>
  <select value.bind="obj.selected">
    <option repeat.for="option of values" value="${option.id}">${option.text}</option>
  </select>
</template>

问题是select的初始值不是预期的thirth选项。

要使其正常工作，我需要做些什么？

Plunk example

Answer 1

id属性的类型为number，因此您需要确保每个选项元素的“值”也是类型编号。这意味着您不希望使用字符串插值绑定（例如${...}），因为它们始终将源值转换为字符串。您也不希望使用option元素的value属性来存储值，因为此属性只接受字符串。而是使用model属性，这是aurelia的绑定系统理解的特殊属性，可以存储任何类型。文档here中讨论了这些场景。

tldr：将你的选项元素绑定更改为：

<option repeat.for="option of values" model.bind="option.id">${option.text}</option>

Aurelia选择初始值

1 个答案: