JavaScript-Funktion nicht Array-Elemente abrufen

Question

Ich habe ein Array von Elementen (die ich ein Snippet von unten zeigen), mit verschiedenen Ebenen von Array-Elementen, und ich möchte eine bestimmte Funktion, um eine bestimmte Ebene des Arrays abrufen Elemente und präsentieren sie in einer Tabelle, die für meine ersten beiden Funktionen nahtlos funktioniert, aber nach dem Duplizieren meiner vorherigen Funktion und Ändern der entsprechenden Variablennamen und Verweise, die zweite Funktion nicht erfolgreich Array-Elemente zum Bildschirm anzuzeigen.

Ich habe nach möglichen Verweisungen oder kleinen fehlenden Elementen gesucht, aber ich bin ratlos.

Hier ist meine var-Array:

{title: "Basketball Topics", followers: 122, articles: 4, posts: [ 
    {postId: 106, contents: "data", author: "data", replies:[ 
     {replyId: 16, comment: "data", comment_author: "data"}, 
     {replyId: 17, comment: "data", comment_author: "data"}, 
     {replyId: 18, comment: "data", comment_author: "data"} 
    ]}, 
]} 

Hier sind einige sehr minimal Ereignisfunktionen Tabelle onClick für meine Array Referenzierung Funktionen

function topicOnClick (node, topic){ 
    'use strict'; 
    node.on("click", function() { 
     showSingleTopic(topic); 
    }); 
} 

function threadOnClick (node, topic){ 
    'use strict'; 
    node.on("click", function() { 

     showComments(topic); 
    }); 
} 

entsprechenden Seiten Anzeigen Hier sind:

function getSingleTopic(someTopics, topicTitle) { 
    return someTopics.find(function (topic) { 
     return topic.title === topicTitle; 
    });  
} 

function getSingleComment(someTopics, topicTitle) { 
    return someTopics.find(function (topic) { 
     return topic.contents === topicTitle; 
    });  

} 

Hier sind die Schleifen, die versuchen, die Array-Elemente über die Tabelle anzuzeigen Elemente:

function showSingleTopic (topicDetails){ 

    'use strict'; 

    var page = $("#individualForumPage"); 

    var individualTopicTable = $("<table class='forumTable'><tr><th>Contents</th><th>Author</th></tr></table>"); 



     for (index in topicDetails.posts) { 

         var post = topicDetails.posts[index]; 
     var row = $("<tr></tr>"); 
     row.append("<td>" + post.contents + "</td>"); 
     row.append("<td>" + post.author + "</td>"); 

     threadOnClick(row, topics[index]); 
     individualTopicTable.append(row); 

     } 
    page.html(individualTopicTable); 
} 

Und hier ist die doppelte Funktion, die nicht auf Bildschirm angezeigt (nicht Array-Elemente entweder nicht abrufen):

function showComments (commentDetails){ 

    'use strict'; 

    var page = $("#commentsPage"); 


    var commentTable = $("<table class='forumTable'><tr><th>Author</th><th>Comments</th></tr></table>"); 



     for (index in commentDetails.replies) { 

         var reply = commentDetails.replies[index]; 

     var row = $("<tr></tr>"); 
     row.append("<td>" + reply.comment_author + "</td>"); 
     row.append("<td>" + reply.comment + "</td>"); 

     commentTable.append(row); 

     } 

page.html(commentTable); 


} 

Answer 1

In Ihrem showSingleTopic den Wert, den Sie vorbei an den Klick Handler scheint falsch zu sein. Sie haben:

threadOnClick(row, topics[index]); 
individualTopicTable.append(row); 

Aber es sollte wohl sein:

threadOnClick(row, post); 
individualTopicTable.append(row); 

Der Beitrag, den Sie bereits verweisen das Kind key 'Details', die in showComments verwiesen wird(). Ihr ursprünglicher Code wendet den Index auf ein anderes Array an als das, von dem er ursprünglich abgeleitet wurde.