2016-12-16 8 views
0

私はRailsの宝石を使用していますacts_as_commentable_with_threading。それは素晴らしい作品です。AngularJSのネストされたコレクションにアイテムをプッシュ

フロントエンドにもAngularJSを使用しています。私は、レンダリングされるコメントについては、以下のJSONを返すコントローラがあります:誰かが2のIDが新しく作成されたコメントを意味してコメントに返信することを選択した場合

[ 
    { 
     "comment":{ 
     "id":1, 
     "commentable_id":1, 
     "commentable_type":"Post", 
     "title":null, 
     "body":"This is a very cool comment!", 
     "subject":null, 
     "user_id":5, 
     "parent_id":null, 
     "lft":1, 
     "rgt":4, 
     "created_at":"2016-12-16 03:50:24", 
     "updated_at":"2016-12-16 03:51:24" 
     }, 
     "children":[ 
     { 
      "comment":{ 
       "id":2, 
       "commentable_id":1, 
       "commentable_type":"Post", 
       "title":null, 
       "body":"I definitely think this is cool too.", 
       "subject":null, 
       "user_id":7, 
       "parent_id":null, 
       "lft":2, 
       "rgt":3, 
       "created_at":"2016-12-16 03:51:06", 
       "updated_at":"2016-12-16 03:51:24" 
      }, 
      "children":[ 

      ] 
     } 
     ] 
    } 
] 

を前記children配列に挿入されるだろうコメント。これを角度で行う方法はありますか?または、私は基本的に、同じIDを持つコメントオブジェクトを見つけて新しいコメントを子配列にプッシュするまで、各コメントとその子をループする独自の再帰関数を記述しますか?

私はWebサイト上の他のユーザーに1つのコメントを送信しています。

答えて

0

コメントのネストされた配列のフラットなバージョンであるマップを維持することができます。再帰的にコメント配列をループし、すべての要素をマップに追加する必要があります(一度、コメントを表示する前に)。例えば

function addCommentsToMap(comments, commentsMap) { 
    comments.forEach(function(comment) { 
     commentsMap[comment.id] = comment; 
     addCommentsToMap(comment.children, commentsMap); 
    }); 
} 

var commentsMap = {}; 
addCommentsToMap(comments, commentsMap); 

は、このようなマップは、1つの操作のみでコメントを挿入することが可能になる持ちます。新しいコメントが来るとき、あなたは単にそれを置くことができます:それはマップと同じオブジェクトで構成されて

commentsMap[parentCommentId ].children.push(newComment); 

はその後、newCommentは、あなたの再帰的な配列に表示されます。

+0

ああ素晴らしいです!私はこれについても考えなかった。角度。ええ。どうもありがとう。 – Eef

+0

助けてくれれば回答を受け入れてください。 –

関連する問題