2014-06-05 110 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

相關問題