Angularjs的$http异步删除数据详解及实例
程序员文章站
2022-09-02 14:34:21
angularjs的$http异步删除数据详解及实例
有人会说删除这东西有什么可讲的,写个删除的service,controller调用一下不就完了。
嗯...看起来是...
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异步删除数据的实例详解,如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
上一篇: Vue列表页渲染优化详解