下拉列表顯示[對象對象]而不是使用敲除的值

我正在使用敲除嘗試將數據綁定到下拉列表中，但由於某些原因，我只能看到[對象] [對象]而不是我想要的實際值顯示並不確定我會做錯什麼。這是我到目前爲止有：下拉列表顯示[對象對象]而不是使用敲除的值

self.views = ko.observableArray(); 
self.selectedView = ko.observable(); 

if (views){ 
    for(viewOption = 0; viewOption < views.length; viewOption++){ 
      self.views.push( 
        new viewModel(views[viewOption]) 
      ); 
     } 
    }

//採樣數據

var sampleData = { 
      viewers: [ 
       ..... 
      ], 
      views: [ 
       { 
        vValue: 'View 1' 
       }, 
       { 
        vValue: 'View 2' 
       } 
      ] 
     };

// HTML

<select data-bind="options: views, value: selectedView"></select>

當我運行此我得到一個下拉菜單顯示的選項爲正確的數目但不是顯示視圖1和視圖2，而是顯示[object] [object]兩次。

來源

2015-08-15 072et

當您使用數組對象，你應該使用選項標籤optionsText和期權價值optionsValue。

var vm = { 
 
    myItems: [ 
 
    { vValue: 'View 1', id: 1}, 
 
    { vValue: 'View 3', id: 3}, 
 
    { vValue: 'View 4', id: 4} 
 
    ], 
 
    selected: ko.observable() 
 
}; 
 
ko.applyBindings(vm);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 

 
<select data-bind=" 
 
    options: myItems, 
 
    optionsText: 'vValue', 
 
    optionsValue: 'id', 
 
    value:selected" > 
 
</select> 
 
<br/> 
 
Selected: <label data-bind="text: selected"></label>

來源

2015-08-15 01:18:53

既然你提供複雜類型的數組到options結合，剔除不知道你想爲你的選擇項的「文本」（即使您使用的值只有一個名稱/值對）。在大多數現實場景中，您將不僅僅是複雜類型數組中的文本值。

您可以使用optionsText結合指示淘汰賽在名稱/值對vValue使用你的價值，像這樣：

<select data-bind="options: views, value: selectedView, optionsText: 'vValue'"> 
</select>

另一種方式來處理，這是在創建views陣列您視圖模型只是一個字符串數組，然後Knockout知道數組中的單個字符串值是用作選項文本值的值。

UPDATE

您可以只創建一個字符串的JavaScript數組，像這樣：

self.views = ["View1", "View2"];

然後你就可以保持你的options綁定語法一樣的，因爲你不必綁定Knockout中的可觀察數組，您可以將其綁定到純粹的JavaScript數組。

注 - 通常人們有一個observableArray，因爲他們的數據是動態的（無論是通過從服務器或用戶交互加載），但沒有規則約束的對象必須是「可觀察的」;儘管如果綁定到不可觀察對象，您將不會獲得像文本輸入那樣的雙向綁定。

來源

2015-08-15 01:48:38

感謝您的提示！但我想知道更多關於如何以另一種方式做到這一點，如果我要在視圖模型中創建一個字符串數組，這將使我無需執行for循環？在我的情況下，我在下拉菜單中顯示的選項只會是這兩個選項，我不會從數據庫或任何其他位置調用選項。 – 072et

@ 072et - 查看更新的答案。 –

下拉列表顯示[對象對象]而不是使用敲除的值

回答

相關問題