Question

我正在尝试设置通过{{view Em.Select}}生成的选择框的默认选择值，根据文档将valueBinding设置为适当的值或selecitonBinding，这应该是一项非常简单的任务到项目所代表的完整对象。

HTML

<script type="text/x-handlebars">

    {{outlet}}

</script>

<script type="text/x-handlebars" data-template-name="index">

    !{{dafaultOption}}!

    {{view Em.Select prompt="test" contentBinding="controllers.option.content" optionLabelPath="content.name" optionValuePath="content.id" valueBinding="dafaultOption" }}
</script>

JS

App = Ember.Application.create();

App.Store = DS.Store.extend({
    adapter: DS.FixtureAdapter
});

App.Router.map(function() {
  // put your routes here
});

App.IndexController = Em.Controller.extend({
    dafaultOption: 'OP2',
    needs:['option']  
});

App.Option = DS.Model.extend({ 
    name: DS.attr('string')
});

App.Option.FIXTURES = [
    {
        id: 'OP1',
        name: 'Option 1'
    },
    {
        id: 'OP2',
        name: 'Option 2'
    }
];

App.OptionController = Em.Controller.extend({
    init: function() {
        this._super();
        this.set('model', this.get('store').find('option'))
    }
})

注意页面加载之间的值!!尽管在IndexController声明中defaultOption被设置为'OP2'，但它是空的。如果我从valueBinding中移除{{view Em.Select}}选项，则输出OP2 !!正如预期的那样，这让我相信当正在呈现select时，它会将indexController.defaultOption设置为null（提示选项）。当我手动更改选择时，值会按预期更新。有什么想法吗？

Answer 1

selectionBinding是在Ember.Select上设置的正确参数，但它应该是您传递给contentBinding的数组中包含的项目，因此执行此操作应该可以正常工作

在App.OptionController上定义属性以保留所选项目：

App.OptionController = Em.Controller.extend({
  selectedOption: Ember.computed.alias('content.firstObject'),
  init: function() {
    this._super();
    this.set('model', this.get('store').find('option'))
  }
});

并将此属性设置为selectionBinding：

{{view Em.Select 
  prompt="test" 
  contentBinding="controllers.option.content" 
  optionLabelPath="content.name" 
  optionValuePath="content.id" 
  selectionBinding="controllers.option.selectedOption" }}

工作demo。

希望它有所帮助。

Answer 2

您会注意到模板中的dafaultOption为空。这是执行问题的顺序。 select的内容最初为空，因此Ember.Select更新以选择匹配项（在这种情况下，没有匹配，因为没有加载），dafaultOption更新为null。然后加载您的数据，并且dafaultOption为null时，不会选择任何项目。

使用ID的工作演示： http://jsfiddle.net/eZWXT/

或者你可以使用直观像素的演示，它使用对象相等。

设置Ember。选择默认选择的值

2 个答案: