knockout javascript data-bind выпадающий список

Question

в течение нескольких дней Я начал работать с нокаутом javascript и bootsrap. Я хочу добавить некоторые элементы в раскрывающийся список, элементы из базы данных и получить идентификатор (базу данных) для щелчка для поиска других данных. добавить данные из контроллера:

success: function (data) { 
      if (data != null) { 
       $.each(data, function (index, element) { 
        document.pvm.CartLst.push({ Id: element.ID, Name: element.ShortName }); 
       }); 
      } 
     } 

И я добавить эти данные в списке:

_mVM.Averagepace = function (item, event) { 
     var element = {cartlist: document.pvm.CartLst()}; 
     var rvm = new panelViewModel(element); 
     _mVM.rapArray.push(rvm); 
    } 

В .cshtml у меня есть это:

<ul class="dropdown-menu scrollable-menu" aria-labelledby="dropdownMenu6" data-bind="foreach: cartlist"> 
<li data-bind="click: document.pvm.changeSelC"><a href="#"><b data-bind="text: $data"></b></a></li></ul> 

Когда выбор это называет это:

_mVM.changeSelC = function (item, event) { 

      //get the id of the selected cart from the dropdownlist 

      } 

Проблема заключается в том, что в моем выпадающем списке появляется список «[object Object]», но он должен отображать только имена из CartLst. И когда выбор изменится, чтобы получить идентификатор за этим именем внутри _mVM.ChangeSelC. Я искал разное решение, но не для меня. Если вы можете мне помочь, я буду признателен.

Answer 1

Это, как вы обычно получаете «[object Object]» в раскрывающемся меню с KnockoutJS:

ko.applyBindings({ availableItems: [{Id: 1, Name: 'some item'}] });

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

Это на самом деле логично, если вы думаете об этом: в option s привязываются к объектов в массиве. Вы уже намекаете на это: вам нужно сказать Knockout, чтобы использовать свойство предметов name для отображения option. Это documented in the options binding и использует optionsText связывания, например, так:

ko.applyBindings({ availableItems: [{Id: 1, Name: 'some item'}] });

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 
<select data-bind="options: availableItems, optionsText: 'Name'"></select>