2

我是 knockout.js 的新手，并且已经完成了他们网页上的示例。我的工作的一个相关示例是Ajax 待办事项列表之一，其中列表的条目在浏览器和服务器之间来回发送。

我正在尝试建立一个带有评论列表的网站。

<ul data-bind="foreach: comments, visible: comments().length > 0">
    <li>
        <input data-bind="value: title, disable: isDone" />
        <a href="#" data-bind="click: $parent.removeComment">Delete</a>
    </li>
</ul>

在加载站点时，我可以使用 observableArray 对象并让淘汰赛创建整个 ul 列表。但是，我也希望该站点可以在没有 javascript 和 ajax 的情况下工作（以便搜索引擎可以对其进行索引，而没有 javascript 的用户可以使用它）。因此，如果站点可以从服务器加载一些已经存在的评论作为 html，那就更好了。但我希望knockout.js 以与新添加的相同的方式处理现有的评论，即我希望所有的li 元素都成为comments-observableArray 的一部分，即使是从服务器作为html 加载的那些。这可能吗？如何？

4

2 回答 2

1

不，您不能“混合”淘汰数据源和 html。但是你可以显示你的html，然后使用knockout来显示动态评论。

您可以将新项目添加到 Ajax 回调函数中的注释 observableArray 中。

初始化绑定

var vm = {
    comments : ko.observableArray([...])
};
ko.applyBindings(vm);

服务器回调函数

var ajaxCallback = function(items){
    ko.utils.arrayForEach(items,  function(item){
        vm.comments.push(item);
    });    
}

可能您可以在服务器上生成一个脚本，在客户端初始化评论数组。

我希望它有所帮助。

于 2013-07-17T09:30:22.697 回答
0

为了解决这个问题，我用 JSON 预先填充了我的 observables，并将相同的 JSON 传递给服务器端进行渲染。生成的 HTML 如下所示：

<input data-bind="value: title" value="{{title}}" />

我使用 NodeJS / Handlebars，但这可以通过任意数量的服务器端 / 模板组合来完成。例如 PHP/Smarty。

于 2015-03-17T11:26:02.043 回答