如何将knockout js viewmodel数据绑定到jquery动态创建的行

在绑定到viewmodel的页面中，我有一个部分，用户可以在其中向页面添加元素。元素是一个过滤器部分，由几个值字段和需要数据绑定到viewmodel的select元素组成

在html中内联运行select选项效果很好。但是，一旦我将其取出并添加到jquery中，jquery添加了filter控件，它就无法绑定。我意识到这部分是由于视图模型已经被绑定，我尝试再次调用apply绑定，但也失败了

我不能像在其他领域那样使用foreach，因为这个部分是可选的。如果用户不想添加过滤器，则不必添加过滤器，这就是我选择jquery路线的原因

是否有人能提供一些建议，说明一旦页面已经呈现，如何将select元素重新绑定到视图模型，或者是否有更好的方法使用justknockout来实现这一点

代码： html

提前感谢,

---

-干杯

我确实会使用

foreach

绑定。毕竟，如果用户还没有单击“添加”，可观察数组可能没有条目。Knockout设计用于处理这种动态UI

在视图模型上使用类似以下内容：

ReportObject.filterRows = ko.observableArray();
ReportObject.addFilterRow = function () {
    ReportObject.filterRows.push({});
};
ReportObject.removeFilterRow = function (filterRow) {
    ReportObject.filterRows.remove(filterRow);
}

在您的HTML中有类似的内容：

去除

我对你的答复感到困惑。您所说的对它的工作方式有意义，但在我的场景中，我不理解filterRows数组将包含什么。此数组不能由所选数据填充。我需要有能力建立'N'个过滤条件，其中包含一个数据绑定选择元素。在您的示例中，filterrows似乎是由选定的元素驱动的。我可能完全忽略了这一点，但我需要添加包含html字段和一个数据绑定ui元素的ui元素。我错过了什么？

function CreateFilterRow() {
        $("<div class='filterrow'><select class='queryterm' name='condition'><option  value='AND'>AND</option><option value='OR'>OR</option></select>" +
    "<select data-bind='options: SelectedAttributes(), optionsCaption:'Select a Field...'></select>&nbsp;&nbsp;<select name='operator'class='operClass'><option value='EQUALS' id='opt1'>Equals</option><option id='opt1' value='CONTAINS'>Contains</option><option id='opt2' value='DOES NOT CONTAIN'>Does Not Contain</option><option id='opt3' value='LIKE'>Like</option><option id='opt4' value='BETWEEN'>Between</option></select>&nbsp;&nbsp;<input type='text' class='queryterm' name='fieldValue1' id='fieldvalue1' value='' size='25' />&nbsp;&nbsp;<a id='btnRemove' class='ui-button-text-only'>Remove</a><a id='btnadd' class='ui-button-text-only'>Add</a></div>").appendTo('#filterBuilder');
    };

    //orignal add row button
    $(document.body).on('click', '#add', function (event) {
        CreateFilterRow();
        ko.applyBindings(ReportWriterViewModel);
    });

 ko.applyBindings(ReportWriterViewModel , document.getElementById('filterSection'));

ReportObject.filterRows = ko.observableArray();
ReportObject.addFilterRow = function () {
    ReportObject.filterRows.push({});
};
ReportObject.removeFilterRow = function (filterRow) {
    ReportObject.filterRows.remove(filterRow);
}