Knockout.js 如何使用foreach和signer防止child div被Knockout JS绑定

我使用以下博文创建了一个FaceBook风格的评论系统：

我通过添加/删除隐藏的css类名来切换commentSection div，从而扩展了该功能。如果我只打开了浏览器的一个实例，那么它工作得非常好。但是，当我打开第二个浏览器时，加载该浏览器会将两个浏览器实例的注释部分重置为其默认的隐藏类。有没有人建议如何从敲除绑定中解除commentSection div的绑定，以便该div由客户端控制，而不是通过敲除？以下是我根据上面提到的博客文章编写的缩写代码：

HTML:
...
<ul id="msgHolder" class="post-ul" data-bind="foreach: posts">
     <li class="postHolder post-li"> 
        <div class="postFooter">
           ...
           <a class="toggleCommentSection" href="#" data-bind="click: toggleCommentSection, visible: PostComments().length > 0">View Comment(s)</a>
           <div class="commentSection hidden">
              <ul class="post-ul" data-bind="foreach: PostComments">
                ...
              </ul>
           </div>
        </div>
     </li>
</ul>
...

SCRIPT:
function Post(data, hub, owner) {
   ...
   self.toggleCommentSection = function (item, event) {
        if ($(event.target).next('.commentSection').is(':visible')) {
            $(event.target).next('.commentSection').addClass("hidden");
            $(event.target).html("View Comment(s)");
        }
        else {
            $(event.target).next('.commentSection').removeClass("hidden");
            $(event.target).html("Hide Comment(s)");
        }
    }
}

---

问题不在于它仍然绑定到knockoutjs。问题是，如果有人连接，所有的帖子都会再次加载

从邮政枢纽：

// GET api/WallPost
public void GetPosts()
{
    ...
    Clients.All.loadPosts(ret);
}

我想这应该是Clients.Caller.loadPostsret。但除此之外，这意味着如果有人调用GetPosts，则会在所有客户端上调用函数loadPostsdata：

self.hub.client.loadPosts = function (data) {
    var mappedPosts = $.map(data, function (item) { return new Post(item, self.hub); });
    self.posts(mappedPosts);
}

这将用新员额取代这些员额。这反过来会再次呈现隐藏状态，这意味着您失去了隐藏状态

为了防止这种情况发生，您还应该使用knockoutjs来记住隐藏状态：

将属性添加到客户端帖子：

HTML：

---

欢迎来到淘汰赛的世界

你的服务器代码是什么样子的？要重置其他浏览器实例，它必须从集线器触发某些事件。您链接到的站点显示它正在调用Clients.All.loadPostsret；是否将注释部分隐藏在那里？如果将注释部分隐藏在那里，则它将对所有浏览器实例隐藏注释部分。因此，如果我正在查看评论，而另一个用户打开同一个站点，它会折叠我正在查看的评论。我确实在该特定函数中调用Clients.All.loadPostsret为了澄清我的回答，我没有任何代码来隐藏loadPosts函数中的comment部分。它只是将返回的帖子添加到我当前的帖子中：var mappedPosts=$.mapdata，函数项{return new positem，self.hub，self；}；self.postsmappedPosts；所以你让我想：如果我使用Clients.Caller.loadPostsret；而不是全部。就这样。我不确定这可能会有什么其他影响，所以我将进行一轮测试，如果发现任何问题，请告诉您。如果您想将其设置为一个答案而不是一个评论，我将很高兴将其标记为这样。谢谢谢谢你的精彩解释。将服务器端代码从Clients.All更改为Clients.Caller似乎足以修复丢失隐藏状态的问题。我错过什么了吗？还要感谢热情的击倒欢迎。这是一次有趣而激动人心的冒险！没有什么比刻苦学习更好的了这在您的情况下修复了它，但在将来，如果您决定再次获取所有帖子，请调用self.hub.server.getPosts，您将再次丢失隐藏状态。但是你仍然可以尝试通过敲除来实现commentsHidden。明白了。谢谢你的帮助！

self.commentsHidden = ko.observable(true);

<ul id="msgHolder" class="post-ul" data-bind="foreach: posts">
     <li class="postHolder post-li"> 
        <div class="postFooter">
           ...
           <a class="toggleCommentSection" href="#" data-bind="
               click: toggleCommentSection, 
               visible: PostComments().length > 0, 
               text: commentsHidden() ? 'View Comment(s)' : 'Hide Comment(s)'
               "></a>
           <div class="commentSection" data-bind="css: { hidden: commentsHidden }">
              <ul class="post-ul" data-bind="foreach: PostComments">
                ...
              </ul>
           </div>
        </div>
     </li>
</ul>

self.toggleCommentSection = function() {
    self.commentsHidden(!self.commentsHidden());
}