如何添加選項到淘汰賽js選項中的第一個選項？

Question

我有此代碼，

<select class="form-control" required data-bind="options: legends, value: statusToChange"> 

我有一個傳說陣列。我想在選項中添加「」（空格）。但我不想在數組中添加它。

我使用基因敲除js爲這個應用程序，所以我有self.legends（）作爲傳說數組。

Answer 1

這聽起來像你正在尋找的optionsCaption binding：

optionsCaption

有時候，你可能不希望默認選擇任何特定選項。但是單選下拉列表通常從選擇的某個項目開始，因此如何避免預選某些內容？通常的解決方案是在選項列表前添加一個特殊的虛擬選項，該選項只讀取「選擇一個項目」或「請選擇一個選項」或類似選項，並且默認選擇該選項。

這個很簡單：只需添加一個名稱爲optionsCaption的附加參數，其值是要顯示的字符串。例如：

<select data-bind='options: myOptions, optionsCaption: "Select an item...", value: myChosenValue'></select> 

KO將前綴與一個顯示文本的項目列表「中選擇一個項目......」和值爲undefined。因此，如果myChosenValue的值爲undefined（默認情況下爲可觀察值），則將選擇虛擬選項。如果參數optionsCaption是可觀察值，則初始項目的文本將隨着可觀察值的更改而更新。

實施例：

var vm = { 
 
    legends: ko.observableArray([ 
 
    "one", 
 
    "two", 
 
    "three", 
 
    "four" 
 
    ]), 
 
    legend: ko.observable() 
 
}; 
 
vm.legend.subscribe(function(newValue) { 
 
    console.log("Legend: " + newValue); 
 
}); 
 
ko.applyBindings(vm, document.body);

<select data-bind="options: legends, optionsCaption: 'legends', value: legend"></select> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>