Question

如何使用下拉框替换其中一个动态生成的输入字段。即。我想用下拉列表替换第一个输入字段。

<select><option value='1'>1</option><option = '2'>2</option></select>

这是jsfiddle http://jsfiddle.net/z9tWd/

Answer 1

您想要使用模板。像

这样的东西

<div data-bind="template: { name: template, data: $data }"></div>

http://jsfiddle.net/WYH68/

还有一些图书馆可以帮助你制作这些整洁的，就像这个（作者） https://github.com/AndersMalmgren/Knockout.BindingConventions

与上面相同的例子看起来像 http://jsfiddle.net/C2Gky/

Answer 2

您可以使用if绑定在input和select之间进行选择：

<!-- ko if: type() === 'input' -->
<input data-bind="value: name" />
<!-- /ko -->
<!-- ko if: type() === 'select' -->
<select data-bind="options: options,optionsCaption: 'Choose...', value: name">
</select>
<!-- /ko -->

然后您可以像这样更改Item：

function Item(id, options) {
    this.id = ko.observable(id);
    this.type = ko.observable(options instanceof Array ? "select" : "input");
    this.name = ko.observable(this.type() === 'input' ? options : undefined);
    this.options = ko.observableArray(this.type() === 'select' ? options : null);
    this.dirtyFlag = new ko.dirtyFlag(this);
}

创建Item时，如果将其作为第二个参数传递给它，则会自动创建一个下拉列表：

this.items = ko.observableArray([
    new Item(1, "one"),
    new Item(2, "two"),
    new Item(3, "three"),
    new Item(4, ["1", "2"])
]);

请注意，您的isDirty仍有效。

使用knockout.js将选择选项添加到动态生成的表单中

2 个答案:

Demo