在 flapper news / mean-stack-tutorial 中使用 $index 的问题

Question

我正在尝试学习本教程 https://thinkster.io/mean-stack-tutorial/。我已经完成了 'Beginning Node' 部分之前的所有操作。所以基本上我只有 angularJS 部分，而不是后端部分。但是，我已经遇到了 ui-routing 的问题。我已经在 app.js 中添加了我的项目...

 posts: [
             { title: "Post 1", link: "#", upvotes: 5, comments: [] },
             { title: "Post 2", link: "#", upvotes: 2, comments: [] },
             { title: "Post 3", link: "#", upvotes: 5, comments: [] },
             { title: "Post 4", link: "#", upvotes: 9, comments: [] },
             { title: "Post 5", link: "#", upvotes: 4, comments: [] }
 ]

...但是帖子按照数量排序后upvotes...

<div ng-repeat="post in posts | orderBy:'-upvotes'">

...原来的$index好像已经不匹配了。例如，最初我将 Post 2 添加为第二项。但是在订购之后，它显示为最后一个，因为它的赞成票最少。现在，如果我尝试通过单击 'comments' 查看帖子页面...我看到了错误的标题。因此，如果我为 'Post 2' 单击 'comments'，我会看到标题 'Post 5'... 因为在排序之后，'Post 2' 是最后一项，而 angularJS 会尝试加载最后一个索引的帖子页面，但它会从原始列表中打开索引，因此 'Post 5'。最初，我曾预计 $index 是无关紧要的，因为在 app.js 中我们应该将 MainCtrl 和 PostsCtrl 连接到相同的服务工厂 object。然而事实并非如此

Perhaps，我刚刚搞砸了某个地方，因为这似乎是一个太基本的问题，无法在教程中坚持这么久。有人可以确认该教程确实有效吗。

ps - 我了解到在本教程的后面，一旦涉及到 mongoDB，本教程将开始使用正确的 ID 而不是 $index，这应该可以解决问题...但我仍然想知道我现在做错了什么。谢谢。

您可以在此中找到要执行的代码。向下导航至已接受的答案，然后运行 code/snippet 了解我的意思。

Answer 1

在检查了遵循相同教程的其他人的代码后，我得出的结论是我正确地遵循了教程。导致此行为的是教程本身中使用的代码。事实上，直到你也完成了后端之后的教程（即开始节点）......一旦你改变了索引， angularJS 部分本身甚至无法显示正确的评论列表，通过增加投票。

在 flapper news / mean-stack-tutorial 中使用 $index 的问题

Issues with use of $index within flapper news / mean-stack-tutorial

angularjs

mean-stack