首页 > 编程 > JavaScript > 正文

Angularjs的$http异步删除数据详解及实例

2019-11-19 15:58:07
字体:
来源:转载
供稿:网友

Angularjs的$http异步删除数据详解及实例

有人会说删除这东西有什么可讲的,写个删除的service,controller调用一下不就完了。

嗯...看起来是这样,但是具体实现起来真的有这么简单吗?首先有以下几个坑

怎么确定数据是否删除成功?

怎么同步视图的数据库的内容?

1.思路

1.实现方式一

删除数据库中对应的内容,然后将$scope中的对应的内容splice

2.实现方式二

删除数据库中对应的内容,然后再reload一下数据(也就是再调用一次查询方法,这种消耗可想而知,并且还要保证先删除数据再查询)

2.具体实现方式

删除数据的service:用异步,返回promise

service('deleteBlogService',//删除博客    ['$rootScope',      '$http',      '$q',      function ($rootScope, $http, $q) {        var result = {};        result.operate = function (blogId) {          var deferred = $q.defer();          $http({            headers: {              'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'            },            url: $rootScope.$baseUrl + "/admin/blog/deleteBlogById",            method: 'GET',            dataType: 'json',            params: {              id: blogId            }          })            .success(function (data) {              deferred.resolve(data);              console.log("删除成功!");            })            .error(function () {              deferred.reject();              alert("删除失败!")            });          return deferred.promise;        };        return result;      }])

controller里面注意事项

要特别注意执行顺序:确保己经删除完成之后再去reload数据,不然会出来视图不更新             

 /**         * 删除博客         */        $scope.deleteBlog = function (blogId) {          var deletePromise = deleteBlogService.operate(blogId);          deletePromise.then(function (data) {            if (data.status == 200) {              var promise = getBlogListService.operate($scope.currentPage);              promise.then(function (data) {                $scope.blogs = data.blogs;                $scope.pageCount = $scope.blogs.totalPages;              });            }          });        };

以上就是Angularjs的$http异步删除数据的实例详解,如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表