Question

所以我试图将内容添加到可观察数组，但它没有更新。问题不是第一级内容，而是子数组。这是一个小评论部分。基本上我是这个函数来声明评论

function comment(id, name, date, comment) {
    var self = this;
    self.id = id;
    self.name = ko.observable(name);
    self.date = ko.observable(date);
    self.comment = ko.observable(comment);
    self.subcomments = ko.observable([]);
}

我有一个通过id字段

检索对象的函数

function getCommentByID(id) {
    var comment = ko.utils.arrayFirst(self.comments(), function (comment) {
        return comment.id === id;
    });
    return comment;
}

这是我显示评论的地方

<ul style="padding-left: 0px;" data-bind="foreach: comments">
    <li style="display: block;">
        <span data-bind="text: name"></span>
        <br>
        <span data-bind="text: date"></span>
        <br>
        <span data-bind="text: comment"></span>
        <div style="margin-left:40px;">
            <ul data-bind="foreach: subcomments">
                <li style="display: block;">
                    <span data-bind="text: name"></span>
                    <br>
                    <span data-bind="text: date"></span>
                    <br>
                    <span data-bind="text: comment"></span>
                </li>
            </ul>
            <textarea class="comment" placeholder="comment..." data-bind="event: {keypress: $parent.onEnterSubComment}, attr: {'data-id': id }"></textarea>
        </div>
    </li>
</ul>

onEnterSubComment是有问题的事件形式

self.onEnterSubComment = function (data, event) {
    if (event.keyCode === 13) {
        var id = event.target.getAttribute("data-id");
        var obj = getCommentByID(parseInt(id));
        var newSubComment = new comment(0, self.currentUser, new Date(), event.target.value);
        obj.subcomments().push(newSubComment);
        event.target.value = "";
    }
    return true;
};

很有趣，因为当我在初始化期间（在任何函数之外）尝试相同的操作时，它可以正常工作

var subcomment = new comment(self.commentID, "name1", new Date(), "subcomment goes in here");
self.comments.push(new comment(self.commentID, "name2", new Date(), "some comment goes here"));
obj = getCommentByID(self.commentID);
obj.subcomments().push(subcomment);

如果有人可以帮我这个，因为我有点卡住:(

Answer 1

您需要进行两项更改：

1，你必须声明一个可观察的数组：

self.subcomments = ko.observableArray([]);

第二，你必须使用可观察的数组方法，而不是数组方法。即如果你这样做：

obj.subcomments().push(subcomment);

如果subcomments被声明为数组，那么您将使用.push Array方法。但是，您必须这样做才能使可观察数组检测到更改是使用observableArray方法。即，这样做：

obj.subcomments.push(subcomment);

请see this part of observableArray documentation: Manipulating an observableArray：

observableArray公开了一组熟悉的函数，用于修改数组的内容并通知侦听器。

所有这些函数等同于在底层数组上运行本机JavaScript数组函数，然后通知侦听器有关更改

Knockout JS无法更新observableArray

1 个答案: