2014-06-05 137 views
0

我有一个Ember.Select选择框(因为在互联网上没有任何细节从控制器的常规旧选择框中获取一个值 - 如果你有奖励积分可以开导一下那个)完美地工作差不多。问题是,在页面加载时,它显示为空白。完全空白: enter image description hereEmber.Select页面加载空白,但选择第一个选项

但是,如果我点击它,你会看到正确的默认值选择:

enter image description here

甚至没有一个空的选项。如果我逃避它,它保持空白,但只要我点击一个选项: enter image description here

因此,这里是我的控制器,在那里它是从抓住它的选项:

App.IndexController = Ember.ArrayController.extend({ 
selectedDistance: null, 
selectDistance: [ 
    { label: "within 10 mi", value: "10" }, 
    { label: "within 20 mi", value: "20" }, 
    { label: "within 5000 mi", value: "5000" }, 
], 
}); 

下面是一个创建的代码段Ember.Select:

{{view Ember.Select 
content=selectDistance 
optionValuePath="content.value" 
optionLabelPath="content.label" 
selectionBinding="selectedDistance"}} 

这里呈现的HTML:

<select id="ember458" class="ember-view ember-select form-control"> 
    <script id="metamorph-3-start" type="text/x-placeholder"></script> 
    <script id="metamorph-3-end" type="text/x-placeholder"></script> 
    <script id="metamorph-4-start" type="text/x-placeholder"></script> 
    <script id="metamorph-8-start" type="text/x-placeholder"></script> 
    <script id="metamorph-5-start" type="text/x-placeholder"></script> 
    <option id="ember478" class="ember-view" value="10"> 
     <script id="metamorph-9-start" type="text/x-placeholder"></script> 
     within 10 mi 
     <script id="metamorph-9-end" type="text/x-placeholder"></script> 
    </option> 
    <script id="metamorph-5-end" type="text/x-placeholder"></script> 
    <script id="metamorph-6-start" type="text/x-placeholder"></script> 
    <option id="ember479" class="ember-view" value="20"> 
     <script id="metamorph-10-start" type="text/x-placeholder"></script> 
     within 20 mi 
     <script id="metamorph-10-end" type="text/x-placeholder"></script> 
    </option> 
    <script id="metamorph-6-end" type="text/x-placeholder"></script> 
    <script id="metamorph-7-start" type="text/x-placeholder"></script> 
    <option id="ember480" class="ember-view" value="5000"> 
     <script id="metamorph-11-start" type="text/x-placeholder"></script> 
     within 5000 mi 
     <script id="metamorph-11-end" type="text/x-placeholder"></script> 
    </option> 
    <script id="metamorph-7-end" type="text/x-placeholder"></script> 
    <script id="metamorph-8-end" type="text/x-placeholder"></script> 
    <script id="metamorph-4-end" type="text/x-placeholder"></script> 
</select> 

抓取值工作正常,表单工作正常,但我怎样才能阻止它最初为空?谢谢!

回答

2

您应该提供一个prompt属性到Ember.Select。这会将默认的<option>添加到渲染的<select>,但没有值。当没有selection此选项将显示:

{{view Ember.Select 
    content=selectDistance 
    optionValuePath="content.value" 
    optionLabelPath="content.label" 
    selectionBinding="selectedDistance" 
    prompt="Please Select"}} 

http://emberjs.com/api/classes/Ember.Select.html#toc_supplying-a-prompt

相关问题