0

我正在使用 knockout-kendo.js 库开发一个 Web 应用程序。我的问题是，在我将 kendoComboBox 绑定到 observableArray 数据源之后。组合框不反映对 observableArray 所做的更改。

这是我绑定的组合框：

<input data-bind="kendoComboBox: { dataTextField: 'name', dataValueField: 'id', data:     choices, value: selectedChoice, template: '<span>Name: #: data.name # </span>' }" />

这是我的视图模型：

var ViewModel = function() {
this.choices = ko.observableArray([
    { id: "1", name: "apple"},
    { id: "2", name: "orange"},
    { id: "3", name: "banana"}
]);

this.AddChoice = function () {
    choices().push(new { id: "4", name: "frank" });

}

this.selectedChoice = ko.observable();}; 
ko.applyBindings(new ViewModel());

请参阅以下 jsfiddle：

http://jsfiddle.net/austinpantall/chNW8/

请注意当单击按钮将项目添加到数据源 observableArray 时会发生什么。组合框不会将新项目显示为选项。

我对敲击剑道相当陌生，正在寻找一种解决方法/替代方法来让新项目出现在组合框中。

在此先感谢，奥斯汀

4

1 回答 1

1

不确定这对您来说是否仍然是一个问题，但我在为自己寻找另一个问题时偶然发现了这个问题。此解决方案也假设使用 jQuery，但我认为这是您正在寻找的：

HTML：

<div id="wrapper">
<input data-bind="kendoComboBox: { dataTextField: 'name', dataValueField: 'id', data: choices, value: selectedChoice, template: '<span>Name: #: data.name # </span>' }" />
<hr/>
Selected: <strong data-bind="text: selectedChoice"> </strong>

<input type="button" data-bind="click: AddChoice" value="Add Choice" />
</div>

JS/淘汰赛/jQuery：

var ViewModel = function() {
    this.choices = ko.observableArray([
        { id: "1", name: "apple"},
        { id: "2", name: "orange"},
        { id: "3", name: "banana"}
    ]);

    this.AddChoice = function () {
        choices.push({ id: "4", name: "frank" });

    }

    this.selectedChoice = ko.observable();
};

ko.applyBindings($('#wrapper'), ViewModel());

我已经调整了您的 jsFiddle，其版本可以产生您所期望的结果：

http://jsfiddle.net/nTnwx/

希望这可以帮助...

于 2013-10-15T09:41:45.167 回答