Как удалить angular сгенерированный элемент в DOM

90
11

Я столкнулся с этой стеной. Это моя функция удаления из моего mainController.


$scope.delete = function($posts) {
$http.delete('/api/posts/' + $posts._id)
.success(function(data) {
// delete element from DOM
// on success I want to delete the post I'm clicking on.
});

И вот шаблон, где я загружаю свои данные с помощью 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 by @{{post.created_by}}</small>
<small class="pull-right">{{post.created_at | date:"h:mma 'on' MMM d, y"}}</small>
</div>
</div>

Я могу удалить сообщения в моей базе данных, но я не могу понять, как удалить элемент, на который я нажимаю.

спросил(а) 2016-01-06T01:06:00+03:00 4 года, 8 месяцев назад
1
Решение
106

<button ng-click="delete(post)" ng-show="authenticated" class="btn btn-

Это то, что я закончил делать.

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

};

ответил(а) 2016-01-12T23:40:00+03:00 4 года, 8 месяцев назад
81

Насколько я могу видеть в вашем html-коде, у вас есть переменная $scope.posts.results.


ng-repeat предоставляет каждому элементу переменную $index, которую вы можете использовать для удаления элемента


добавьте этот $index в свой html:


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

И затем, в свой контроллер, удалите элемент из вашего массива


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

};


то ng-repeat удалит ваш node из DOM. Вам не нужно напрямую манипулировать DOM.

ответил(а) 2016-01-06T01:14:00+03:00 4 года, 8 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема