javascript - 在不刷新或加载页面的情况下以 Angular 更新数据

Question

我正在实现心愿单，我想从心愿单中删除内容，而无需刷新页面来查看新数据。 这是我所做的:

wish.controller('wishCtrl',['$scope','$http','$cookies','$window',function($scope,$http,$cookies,$window) {


    var user={};
    user.email = $cookies.get('cookieEmail');
     $http.get("http://localhost:3000/wishlist/"+user.email).success(function(data){
        $scope.wishController = data; 
        console.log(data);
    });



        var delclick=0;
        var newView =0;

        $scope.delClick = function(title, des, subj) {

        var wish = {};

        wish.user = $cookies.get('cookieEmail');
        wish.sub = subj;
        wish.title = title;
        wish.description=des;

        console.log(wish.user);
        console.log(wish.title);
        console.log(wish.sub);
        console.log(wish.description);

        delclick=1;

        if(delclick==1)
            {
               $http.post('http://localhost:3000/wishlistDel', wish).then()
               //$scope.load();
               //$window.location.reload();
            }

          }

}]);

正如您在评论中看到的那样，我尝试了 $window.location.reload(); 但它就像刷新一样，因为整个页面被再次上传而不是删除一个项目 - 就像 display :none，有什么办法吗？

编辑

        <div ng-repeat="wishlist in wishController.Themes" >
                 <h2 class="text-center">{{wishlist.title}}</h2>
                 <h2 class="text-center">{{wishlist.description}}</h2>
                 <img ng-src="{{wishlist.image}}" class="imgCenter">
                 <button class="w3-btn w3-ripple" ng-click="delClick(wishlist.title, wishlist.description, wishlist.sub, $index)">click </button>
         </div>

更新

$http.post('http://localhost:3000/wishlistDel', wish).then(function () {
   if(item.sub=='party'){
    var index = $scope.wishController.Party.indexOf(item);
    console.log(index);
    if(index !== -1){
     $scope.wishController.Party.splice(index,1);
    }
}
    if(item.sub=='activity'){
    var index = $scope.wishController.Activity.indexOf(item);
    console.log(index);
    if(index !== -1){
     $scope.wishController.Activity.splice(index,1);
    }
}
    if(item.sub=='theme'){
    var index = $scope.wishController.Themes.indexOf(item);
    console.log(index);
    if(index !== -1){
     $scope.wishController.Themes.splice(index,1);
    }
}

});

Answer 1

您的数据集合似乎在 $scope.wishController 上。您需要专门更新此集合并删除已删除的项目:

$http.post('http://localhost:3000/wishlistDel', wish);
$scope.wishController.splice(indexOfDeletedItem, 1);

由于您要传入 $index，因此您需要使用:

$scope.wishController.Themes.splice($index, 1);