Question

在使用对象而不是字符串时，我在弄清楚如何让Ember的选择视图更新dom时遇到了一些麻烦。这个例子表现我的期望：

http://jsfiddle.net/XZ9b7/

仅使用字符串数组作为值，通过单击按钮将绑定属性的值设置为新值将自动更新dom并将下拉列表设置为相同的值。

但在此示例中使用对象时：

http://jsfiddle.net/pRBKt/

我尝试将绑定属性的值设置为id，value和选项对象本身的副本，但我不能让它影响选择视图。

我只需要一种在使用选项对象时设置选择视图值的方法

Answer 1

我在你的小提琴中添加了另一个按钮：

<div><button onclick="App.someObject.set('letterSelection', App.someOptions.objectAt(0));">real a</button></div>

http://jsfiddle.net/Sly7/BYjk6/#base

我认为你必须使用相同的对象，但不能使用副本。因此，在您的情况下，您必须从绑定到Ember.Select的内容属性的数组中拾取对象。

编辑：jsfiddle使用#each和{{action}}。我认为它会清理模板和代码。

http://jsfiddle.net/Sly7/sCr8T/

<script type="text/x-handlebars">
  {{view Ember.Select
    contentBinding="App.someOptions"
    selectionBinding="App.someObject.letterSelection"
    optionLabelPath="content.val"
    optionValuePath="content.id"
  }}
  {{App.someObject.letterSelection.val}}
  {{#each option in App.someOptions}}
    <div>
      <button {{action "updateSelection" target="App.someObject" context="option"}}>{{option.val}}</button>
    </div>        
  {{/each}}
</script>

JavaScript的：

window.App = Ember.Application.create();

App.someObject= Ember.Object.create({
  title: "Some Title",
  letterSelection: null, 

  updateSelection: function(event){
    var newSelection = event.context;
    this.set('letterSelection', newSelection);
  }
});

App.someOptions = [
  {'id':'id_a','val':'a'},
  {'id':'id_b','val':'b'},
  {'id':'id_c','val':'c'},
  {'id':'id_d','val':'d'}
];

在使用选项对象时，如何设置Ember.js选择视图的值？

1 个答案: