Question

我正在使用Ryan Niemeyer的Knockout-Kendo.js库和breeze.js。我有DropDownList的问题。我将DropDownList定义如下：

<p data-bind= "text: breezeEntityKO().FruitId">  </p> <!--just for debug-->
<input data-bind="kendoDropDownList: { data: selectionOptions, dataValueField: 'FruitId', dataTextField: 'FruitDescription',  value: breezeEntityKO().FruitId}"></input>

这是视图模型

var ViewModel = function() {
this.breezeEntityKO = ko.observable();
//get a breezeEntity. One of the properties on the entity is FruitId
this.breezeEntityKO(breezeEntity); 

breezeEntityKo().FruitId(2) // set Initial selection to orange

this.selectionOptions = ko.observableArray([
    { FruitId: 1, FruitDescription: "apple" },
    { FruitId: 2, FruitDescription: "orange" },
    { FruitId: 3, FruitDescription: "banana" }
]);

this.selectedFruitId = ko.observable(2); // just for debug
};

当我更改FruitId的值时，DropDownList保持空白。调试文本输出中显示正确的值，每次更改breezeEntityKo（）的值时都会更改.FruitId。

breezeEntityKo().FruitId(3) // this changes the value shown on the debug text line but not the drop down list

我可以让DropDownList显示正确值的唯一方法是使用淘汰赛＆＃39;使用＆＃39;捆绑。当我使用＆＃39;与＆＃39;绑定值是这样定义的 - 值：$ data.FruitId

<div  data-bind="with: breezeEntityKO">
    <input data-bind="kendoDropDownList: { data: selectionOptions, dataValueField: 'FruitId', dataTextField: 'FruitDescription',  value: $data.FruitId}"></input>
</div>

这可以胜任。下拉列表显示正确的值。每次我改变breezeEntityKo（）。FruitId DropDownList更新。当我使用下拉列表更改值时，breezeEntity上的FruitId属性正确更改。一切都很好。但是，当我使用淘汰赛时，我会遇到一些性能问题＆＃39; With＆＃39;在这种情况下绑定，所以如果可能我想找到替代方案。

关于如何使用kendoDropDownList的任何想法，其中＆＃39;值＆＃39;来自一个轻而易举的实体上的财产，而不必将所有内容包装在＆＃39; With＆＃39;？

文档在https://rniemeyer.github.io/knockout-kendo/web/DropDownList.html

当＆＃39;价值＆＃39;没有问题。根据文档中的示例，它只是一个ko.observable。当我试图定义“价值”时，我只是遇到了问题。 as breezeEntityKO（）。FruitId或breezeEntityKO.FruitId

修改以下工作没有任何问题，但我需要它使用breezeEntityKO.FruitId而不是selectedFruitId

<input data-bind="kendoDropDownList: { data: selectionOptions, dataValueField: 'FruitId', dataTextField: 'FruitDescription',  value: selectedFruitId}"></input>

Answer 1

这是一个尝试的示例，以便不会重新呈现选项：

this.selectedFruitId = ko.computed(function(){
    return this.breezeEntityKo().FruitId();
}, this);

然后使用编辑中的内容作为标记：

<input data-bind="kendoDropDownList: { data: selectionOptions, dataValueField: 'FruitId', dataTextField: 'FruitDescription',  value: selectedFruitId}"></input>

以下是编辑问题之前的上一个答案：

没有使用knockout-kendo，但通常我发现with绑定是最好和最有效的方法。作为替代方案，您应该能够执行以下操作：

<input data-bind="kendoDropDownList: { data: breezeEntityKO().selectionOptions, dataValueField: 'FruitId', dataTextField: 'FruitDescription',  value: breezeEntityKO().FruitId}"/>

另外，只需注意：除非您确实需要整个对象，否则不需要在with绑定中使用$data：scope隐含为您在{{1}中使用的项的上下文}} 捆绑。所以上面你可以说：with

DropDownList使用knockout-kendo.js和breeze.js时不显示值

1 个答案: