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


Posted in Javascript onJuly 27, 2017

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异步删除数据的实例详解,如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
js 模拟实现类似c#下的hashtable的简单功能代码
Jan 24 Javascript
Jvascript学习实践案例(开发常用)
Jun 25 Javascript
getComputedStyle与currentStyle获取样式(style/class)
Mar 19 Javascript
基于OO的动画附加插件,可以实现弹跳、渐隐等动画效果 分享
Jun 24 Javascript
jquery 滚动条事件简单实例
Jul 12 Javascript
js日期范围初始化得到前一个月日期的方法
May 05 Javascript
Node.js如何自动审核团队的代码
Jul 20 Javascript
JavaScript设计模式之单例模式详解
Jun 09 Javascript
实现微信小程序的wxml文件和wxss文件在webstrom的支持
Jun 12 Javascript
vue中如何动态绑定图片,vue中通过data返回图片路径的方法
Feb 07 Javascript
小程序实现搜索框功能
Mar 26 Javascript
js实现盒子移动动画效果
Aug 09 Javascript
js学习总结之DOM2兼容处理this问题的解决方法
Jul 27 #Javascript
Angularjs的键盘事件的绑定
Jul 27 #Javascript
Angularjs 事件指令详细整理
Jul 27 #Javascript
Bootstrap + AngularJS 实现简单的数据过滤字符查找功能
Jul 27 #Javascript
js学习总结之DOM2兼容处理重复问题的解决方法
Jul 27 #Javascript
angular中实现li或者某个元素点击变色的两种方法
Jul 27 #Javascript
js学习总结之DOM2兼容处理顺序问题的解决方法
Jul 27 #Javascript
You might like
需要注意的几个PHP漏洞小结
2012/02/05 PHP
php+Mysqli利用事务处理转账问题实例
2015/02/11 PHP
Laravel5.4简单实现app接口Api Token认证方法
2019/08/29 PHP
jquery学习笔记二 实现可编辑的表格
2010/04/09 Javascript
日期处理的js库(迷你版)--自建js库总结
2011/11/21 Javascript
再谈javascript面向对象编程
2012/03/18 Javascript
js拼接html注意问题示例探讨
2014/07/14 Javascript
仿淘宝TAB切换搜索框搜索切换的相关内容
2014/09/21 Javascript
简单谈谈jQuery(function(){})与(function(){})(jQuery)
2014/12/19 Javascript
jQuery中add()方法用法实例
2015/01/08 Javascript
JavaScript 模块化编程(笔记)
2015/04/08 Javascript
jQuery实现带有洗牌效果的动画分页实例
2015/08/31 Javascript
js实现交通灯效果
2017/01/13 Javascript
Vue获取DOM元素样式和样式更改示例
2017/03/07 Javascript
使用 Vue 绑定单个或多个 Class 名的实例代码
2018/01/08 Javascript
React Native基础入门之调试React Native应用的一小步
2018/07/02 Javascript
vue data对象重新赋值无效(未更改)的解决方式
2020/07/24 Javascript
利用Python脚本在Nginx和uwsgi上部署MoinMoin的教程
2015/05/05 Python
python妹子图简单爬虫实例
2015/07/07 Python
Python入门_学会创建并调用函数的方法
2017/05/16 Python
深入理解Python分布式爬虫原理
2017/11/23 Python
详谈Python3 操作系统与路径 模块(os / os.path / pathlib)
2018/04/26 Python
python 同时运行多个程序的实例
2019/01/07 Python
Python ConfigParser模块的使用示例
2020/10/12 Python
python 基于opencv操作摄像头
2020/12/24 Python
英国时尚女装购物网站:Missguided
2018/08/23 全球购物
西班牙著名的珠宝首饰品牌:P D PAOLA
2018/09/15 全球购物
波兰灯具、照明和LED购物网站:Lampy.pl
2019/03/11 全球购物
全球领先的全景影像品牌:Insta360
2019/08/21 全球购物
小学岗位竞聘方案
2014/01/22 职场文书
《陋室铭》教学反思
2014/02/26 职场文书
品质主管岗位职责
2014/03/16 职场文书
2014年化妆品销售工作总结
2014/12/01 职场文书
运动会通讯稿50字
2015/07/20 职场文书
幼儿园园长六一致辞
2015/07/31 职场文书
mysql分组后合并显示一个字段的多条数据方式
2022/01/22 MySQL