Merge 2 ko observableArrays to create one nested array

Question

I have 2 Observable Arrays. Comments

  "Comments": [
{
  "CommentID": 5,
  "CommentDateCreated": "1 hour ago",
  "CommentUserName": "Jacques",
  "CommentUserEmail": "http://www.gravatar.com/avatar/b40e3df0130dc8cd9bf864f438bfad4e?d=mm&r=g",
  "CommentText": "Well this seems to be working. Next I have to do the\n<blockquote cite=\"jim\">\nReplies!\n</blockquote >",
  "CommentReplies": []
},
{
  "CommentID": 6,
  "CommentDateCreated": "1 hour ago",
  "CommentUserName": "Jacques",
  "CommentUserEmail": "http://www.gravatar.com/avatar/b40e3df0130dc8cd9bf864f438bfad4e?d=mm&r=g",
  "CommentText": "This is another Reply to test comments counter",
  "CommentReplies": []
},
{
  "CommentID": 7,
  "CommentDateCreated": "1 hour ago",
  "CommentUserName": "Jacques",
  "CommentUserEmail": "http://www.gravatar.com/avatar/b40e3df0130dc8cd9bf864f438bfad4e?d=mm&r=g",
  "CommentText": "Well this is to test the <strike>placeholder</strike>",
  "CommentReplies": []
},
{
  "CommentID": 8,
  "CommentDateCreated": "8 minutes ago",
  "CommentUserName": "Jacques",
  "CommentUserEmail": "http://www.gravatar.com/avatar/b40e3df0130dc8cd9bf864f438bfad4e?d=mm&r=g",
  "CommentText": "Hi another Comment",
  "CommentReplies": []
}
],

and Replies Array

"Replies": [
{
  "CommentID": 8,
  "CommentRepliesText": "Test 4",
  "CommentRepliesUserEmail": "http://www.gravatar.com/avatar/5e543256c480ac577d30f76f9120eb74?d=mm&r=g"
},
{
  "CommentID": 8,
  "CommentRepliesText": "Test 9",
  "CommentRepliesUserEmail": "http://www.gravatar.com/avatar/5e543256c480ac577d30f76f9120eb74?d=mm&r=g"
},
{
  "CommentID": 6,
  "CommentRepliesText": "This is another test",
  "CommentRepliesUserEmail": "http://www.gravatar.com/avatar/5e543256c480ac577d30f76f9120eb74?d=mm&r=g"
},
{
  "CommentID": 5,
  "CommentRepliesText": "This is a test reply",
  "CommentRepliesUserEmail": "http://www.gravatar.com/avatar/5e543256c480ac577d30f76f9120eb74?d=mm&r=g"
}
],

I would like to Create a CommentsAndReplies observable Array from these 2 Arrays. The replies should be nested withing each comment so I can bind them to my elemnts. So where

Comments.CommentID === Replies.CommentID

I would like to push the replies to that specific comment into the CommentsAndReplies array.

So that I en up with something like this:

CommentsAndReplies [{
Comments": [
    {
      "CommentID": 5,
      "CommentDateCreated": "1 hour ago",
      "CommentUserName": "Jacques",
      "CommentUserEmail": "http://www.gravatar.com/avatar/b40e3df0130dc8cd9bf864f438bfad4e?d=mm&r=g",
      "CommentText": "Well this seems to be working. Next I have to do the\n<blockquote cite=\"jim\">\nReplies!\n</blockquote >"
      "CommentReplies": [ {
                     "CommentID": 5,
                     "CommentRepliesText": "This is a test reply",
                     "CommentRepliesUserEmail": "http://www.gravatar.com/avatar/5e543256c480ac577d30f76f9120eb74?d=mm&r=g"
             }
        ]
    },

}]

manji · Accepted Answer · 2014-10-14 13:28:56Z

1

Remap Comments array and add to each comment all replies result of filtering Replies array with CommentId:

var CommentsAndReplies = Comments.map(function(comment) {
    comment.CommentReplies = Replies.filter(function(reply) {
        return reply.CommentID === comment.CommentID;
    });
    return comment;
});

Demo: `JSFiddle`

answered Oct 14, 2014 at 13:28

manji

48k5 gold badges98 silver badges104 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Merge 2 ko observableArrays to create one nested array

1 Answer 1

Demo: `JSFiddle`

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Demo: JSFiddle

Comments

Your Answer

Sign up or log in

Post as a guest

Related

Demo: `JSFiddle`