0

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

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);

如果有人可以帮助我解决这个问题,因为我有点卡住了:(

4

1 回答 1

2

您需要进行两项更改:

第一,你必须声明一个可观察的数组:

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

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

obj.subcomments().push(subcomment);

如果subcomments被声明为数组,您将.push使用Array. 但是,要让 observable 数组检测到变化,您必须使用这些observableArray方法。即,这样做:

obj.subcomments.push(subcomment);

参阅 observableArray 文档的这一部分:Manipulating an observableArray

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

所有这些函数都相当于在底层数组上运行原生 JavaScript 数组函数,然后通知侦听器有关更改

于 2015-11-29T00:01:06.283 回答