i building reddit clone. far able add links, upvote/down vote, , comment/remove comments on links posted. must logged in via twitter add comments or posts.
the big issue facing whenever post has comments, not show if reload website. must add new comment see comments present. next big issue if add new post automatically inherit comments commented on post though these comments not in posts data on firebase server.
if comment on new post causes other post's comments inherit new comment on new post.
here source code.
<div> <span>currently logged in as: {{authdata.twitter.username}}</span> <form> <div class="form-group"> <div class="row"> <div class="col-xs-6"> <label class="control-label" for="focusedinput">post name</label> <input type="text" ng-model="post.name" class="form-control"> </div> </div> <div class="row"> <div class="col-xs-6"> <label class="control-label" for="focusedinput">description</label> <input type="text" ng-model="post.description" class="form-control"> </div> </div> <div class="row"> <div class="col-xs-6"> <label class="control-label" for="focusedinput">url</label> <input type="text" ng-model="post.url" class="form-control"> </div> </div> <div class="row"> <div class="col-xs-3"> <button ng-click="savepost(post)" class="form-control" style="margin-top: 25px">submit</button> </div> </div> </div> </form> </div> <div ng-repeat="post in posts"> <h2><a ng-href="{{post.url}}">{{post.name}}</a></h2> <p>{{post.description}}</p> <button ng-click="deletepost(post)" class="btn btn-danger">delete post</button> <span>{{post.votes}}</span> <button ng-click="addvote(post)" class="btn btn-primary">up vote</button> <button ng-click="removevote(post)" class="btn btn-primary">down vote</button> <br> <br> <div class="panel panel-default" ng-repeat="comment in comments"> <div class="panel-body"> <a ng-href="https://twitter.com/{{comment.user}}">{{comment.user}}</a> </div> <div class="panel-footer"> {{comment.text}} <br> <button class="btn btn-danger" ng-click="removecomment(post, comment)">remove comment</button> </div> </div> <form> <div class="input-group"> <input ng-model="comment.text" class="form-control"> <div class="input-group-btn"><button ng-click="addcomment(post, comment)" class="btn btn-success">add comment!</button></div> </div> </form> </div> <br> <button class="btn btn-primary" ng-click="login()">log in twitter</button> <!--starter project reddit clone--> <!doctype html> <html ng-app="reddit-clone"> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular-route.min.js"> </script> <script src="https://cdn.firebase.com/js/client/2.0.4/firebase.js"></script> <script src="https://cdn.firebase.com/libs/angularfire/0.9.0/angularfire.min.js"></script> <link rel="stylesheet" href="bootstrap.css"> <script src="app.js"></script> <title>reddit clone</title> </head> <body style="width: 80%; margin: 0 auto"> <h1 class="text-center">reddit clone</h1> <div ng-view></div> </body> </html> here picture of database showing comment exists first post. 
here picture showing how comment display on both posts though in 1 in database. 
you storing 1 comments array on $scope.
then in template, looping on 1 array each post inside ng-repeat on posts, hence same both posts. need loop on comments specific post instead. so:
<div class="panel panel-default" ng-repeat="comment in post.comments"> notice post.comments.
Comments
Post a Comment