基于 Aurelia 中的表达式将所选属性添加到选项

Question

我的 Aurelia 视图中有一个 select html 标签（使用 select2），我想在其中添加 selected 属性到基于布尔表达式的 option 标签。该表达式只会为真一次。这是我的代码（这很好用）：

<select class="js-example-basic-single" style="width:200px;">
  <option repeat.for="region of personRegionDetail" value="${region.Id}">${region.Name}</option>
</select>

我正在我的选项标签中寻找这样的东西（如果可能的话）：

${if(region.Id === persondetail.RegionId){ selected }}

我也尝试过使用 jQuery，但这只在我刷新页面时显示 selected 选项：

<script type="text/javascript">
  //Initialize select2
  $('select.js-example-basic-single').select2();
  //I tried this
  //The searched option value contains ${persondetail.RegionId} 
  $('select.js-example-basic-single').val("${persondetail.RegionId}").trigger("change");
</script>

我通过使用 route-href="route:routename"（如果它说明了什么）单击 link 从另一个视图访问该页面。

我的问题是如何解决这个问题，让我在进入页面时显示 selected 选项？

编辑： 我需要在几毫秒后初始化 select2 以显示 selected 选项（可能我必须等待 API 响应）。这导致了 jQuery.

的问题

Answer 1

您必须使用 selected.bind:

<option repeat.for="region of personRegionDetail" value="${region.Id}" selected.bind="region.Id === $parent.Id">${region.Name}</option>

笨蛋：http://plnkr.co/edit/Uy6eQWZu6PrOwaXeArOx?p=preview

基于 Aurelia 中的表达式将所选属性添加到选项

Add selected attribute to a option based on a expression in Aurelia

html

jquery

jquery-select2

aurelia