下拉菜单css not working with knockout bind选项

Question

问题是，当我将选项绑定到下拉列表时，"ui dropdown“会使它消失，并且浏览器中的单元格中什么也没有(它不能在jsfiddle中正确使用css )。如果我删除css，我会看到out of the box下拉列表。

创建一个包含视图模型集合的表，并需要单个风险的下拉列表

//part of the viewmodel
var ViewModel = {
Collection: ko.observableArray(),
availableRisks: ['L', 'H'],

使用

$('.ui.dropdown').dropdown();

帮不上忙。不使用下拉列表的示例代码：

http://jsfiddle.net/7vh2t33m/2/

Answer 1

有用于jQuery UI和knockout的绑定，请使用它们。http://gvas.github.io/knockout-jqueryui/

根据经验，在敲出应用程序中，除了敲出之外，没有任何东西可以接触到DOM，或者在没有通知敲出的情况下。因此，将knockout与jQuery UI混合在一起，而不使用任何东西来弥合它们之间的差距将不会起作用。

取自knockout-jqueryUI selectmenu binding documentation中的示例

var ViewModel = function () {
  this.items = ko.observableArray([
      { id: '1', text: 'First' },
      { id: '2', text: 'Second' },
      { id: '3', text: 'Third' },
      { id: '4', text: 'Fourth' }
  ]);
  this.value = ko.observable('1');
};

ko.applyBindings(new ViewModel());

在视图中

<!-- ko foreach: items -->
<input type="radio" name="radios" data-bind="attr: { value: id }, checked: $parent.value" />
<!-- /ko -->
<br/>
<select data-bind="value: value, selectmenu: { width: 300 }, options: items, optionsValue: 'id', optionsText: 'text'">
</select>
<br />