Knockout.js 将现有HTML绑定到视图模型

我有一个带有服务器内置HTML的页面，比如：

<ul id="list">
    <li>Item 1</li>
    <li>Item 2</li>
</ul>

---

并期望

viewModel

从上述元素中获取

items

数组。但是结果是DOM被清除了。

我假设您无法将来自服务器的html绑定到视图模型

因此，这意味着您正试图从现有HTML对视图模型进行反向工程，您需要遍历DOM以生成所需的结果

所以使用绑定重命名列表，以便应用绑定有一个目标：

<ul id="list2" data-bind="foreach: Items">
    <li data-bind="text: title"></li>

然后，您需要遍历无法使用knockout的原始html列表，并遍历dom以获取值。

var viewModel={
Items=ko.observearray（）；
}
//选择您的列表
变量列表=$（“#列表”）；
//遍历子对象并添加到可观察数组中
ko.utils.arrayForEach（list.children（），函数（i）{
viewModel.Items.push（{Title:i.text（）}）；
}
//然后，可以将视图模型绑定到具有淘汰绑定的html
ko.applyBindings（viewModel，）

我们需要查看您的viewModel。您能将所有代码或简单的演示上传到JSFIDLE吗？我还没有在敲除库中看到这一功能。您可能需要自己遍历DOM，才能将html中的值输入到viewModel中。在使用设计器时，这似乎是一个有趣的功能，但没有backend还没有提供JSON。

<ul id="list2" data-bind="foreach: Items">
    <li data-bind="text: title"></li>

    var viewModel = {
       Items= ko.observableArray();
    }

    //select your list
    var list = $('#list');

    //iterate through the children and add to the observable array
    ko.utils.arrayForEach(list.children(),function(i){
        viewModel.Items.push({Title:i.text()});
    }

     //then you can bind the view model to your html that has the knockout bindings

     ko.applyBindings(viewModel, )
</script>