javascript - How to delete angular generated element in DOM -

i have ran wall this. delete function maincontroller.

$scope.delete = function($posts) {     $http.delete('/api/posts/' + $posts._id)         .success(function(data) {             // delete element dom             // on success want delete post i'm clicking on.         }); 

and here template load data angular.

<div id="post-stream">     <h4>chirp feed</h4>     <div class="post" ng-repeat="post in posts.results | orderby:'created_at':true" ng-class-odd="'odd'" ng-class-even="'even'">         <button ng-click="delete(post)" ng-show="authenticated" class="btn btn-danger btn-xs pull-right remove">x</button>         <p>{{post.text}}</p>         <small>posted @{{post.created_by}}</small>         <small class="pull-right">{{post.created_at | date:"h:mma 'on' mmm d, y"}}</small>     </div> </div> 

i can delete posts in database can't figure out how delete element i'm clicking on.

as far can see in html code, have variable $scope.posts.results.

ng-repeat gives on each element variable $index can use delete element

add $index html :

 ng-click="delete(post, $index)" 

and then, controller, delete element array

$scope.delete = function($posts, postindex) {         $http.delete('/api/posts/' + $posts._id)           .success(function(data) {                $scope.posts.results.splice(postindex, 1);           });  }; 

then, ng-repeat remove node dom. don't need manipulate dom directly.