Angular 在深度填充对象中显示数据

Question

Html

<div ng-controller="topicController">
     <a href="#/dashboard">Dashboard</a> | <a href="#/topics">Topics</a> | <a href="#/users">Users</a>

    <h4>{{topic.user_name}} posted a topic</h4>

    <h2>{{topic.topic}}</h2>
    <h4>Description: {{topic.description}}</h4>
    <div ng-controller="postController">
        <label>Post Your Answer here</label>
            <form>
                <textarea name="post" ng-model="new_post.post"></textarea>
                <input type='submit' value='Submit' ng-click='addPost(users._id, topic._id, users.name)'>
            </form>

            <div ng-repeat="x in topic.posts">
                <h4>{{x.post}}</h4>
                <p>Likes:{{x.up_vote}} Dislikes:{{x.down_vote}}</p>
                <ul ng-repeat="i in topic.posts[x].comments">
                    <li>{{topic.posts[x].comments[i].comment}}</li>
                </ul>
                <div ng-controller="commentController">
                <form>
                        <textarea name="comment" ng-model="model.comment"></textarea><br>
                        <input type="submit" value="Submit" ng-click="addComment(users._id, x._id, users.name)">
                </form>
            </div>
        </div>
    </div>
</div>

正如您在下图中看到的，我已经填充了所有数据，主题对象、主题帖子内部和 posts 评论内部。

在我的 html 中，我可以正确显示主题内容和 post，但无法显示评论。

评论正在添加到数据库但未显示。我有一个 ng-repeat 来遍历每个 post 的每个评论，但它只是没有出现。附加图像以在我的控制台中显示整个对象。

我的 ng-repeat 错了吗？

Answer 1

您误解了 x 在您的 ng-repeat 中代表的意思。 x 是实际的评论对象 - post 上 comments 数组中的每个项目。所以 topic.posts[x] 没有意义。它应该只是 x.

所以，很明显，将其重命名为 comment，而不是 x。

额外提示：出于性能原因，始终将 track by 与 ng-repeat 表达式一起使用。在您的情况下，它将是 track by comment._id.

Answer 2

您的 x 是一个 post 对象，而不是索引。所以你内心的ng-repeat应该是

<ul ng-repeat="c in x.comments">
    <li>{{c.comment}}</li>
</ul>

Angular 在深度填充对象中显示数据

Angular displaying data in a deep populated object

javascript

angularjs

mean-stack