Angular.JS内置服务$http对数据库的增删改使用教程


Posted in Javascript onMay 07, 2017

本文主要介绍的是Angular.JS内置服务$http对数据库的增删改操作的相关内容,分享出来供大家参考学习,下面来看看详细的介绍:

一、使用$http查询MySQL数据

angular.module('app',[])
.controller('MyCtrl',function ($scope,$http) {
 $http.get('http://127.0.0.1:80/user/getUsers')
 .success(function (resp) {
  console.log(resp);
 })
 .error()
 //jQuery
 /*$.get('url',function (data) {
  
 });*/
})

对应的后台Java代码:

public void getUsers(){
  List<User> users = User.dao.find("select * from t_user");
renderJson(Users);
}

二、$http实现对数据的增删改

     (1)$http带参数发送请求

     (2)对MySQL数据增删改

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>AngularJS $http</title>

 <link rel="stylesheet" href="css/foundation.min.css" rel="external nofollow" >
 <style type="text/css">
  html,body{font-size:14px;}
 </style>
</head>
<body style="padding:10px;" ng-app="app">
 <div ng-controller="MyCtrl">
  <input type="text" ng-model="id">
  <input type="text" ng-model="name">
  <button class="button" onclick="addUser()">添加</button>
  <button class="button" onclick="delUser()">删除</button>
 </div>
</body>
<script src="js/angular.min.js"></script>
<script src="app.js"></script>
</html>
angular.module('app', [])
 .controller('MyCtrl', function ($scope, $http) {
  $scope.id=" ";
  $scope.name=" ";
  $scope.addUser = function () {
   $http.post('http://127.0.0.1:80/user/addUser',{id:$scope.id, name:$scope.name})
    .success(function (resp) {
     if(resp.success){
      alert("添加成功");
     }
    })
  }
  $scope.delUser = function () {
   $htp.post('http://127.0.0.1:80/user/delUser',{id:$scope.id})
   .success(function () {
    if(resp.success){
     alert('删除成功');
    }
   })
  }
 })

后台Java代码:

public void addUser(){
  String id = getPara("id");
  String name = getPara("name");
  User user = new User();
  boolean isok = false;
  if(id != null && id.equals("")){
   isok = user.set("id",id).set("name",name).update();
  }else{
   isok = user.set("name",name).save();
  }
  renderJson("seccess",isok);
}

public void delUser(){
  String id = getPara("id");
  boolean isok = User.dao.deleById(id);
  renderJson("seccess",isok);
}

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家学习或者使用Angular.js能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
javascript对象的property和prototype是这样一种关系
Mar 24 Javascript
JavaScript创建一个欢迎cookie弹出窗实现代码
Mar 15 Javascript
浅谈JavaScript中的Math.atan()方法的使用
Jun 14 Javascript
JavaScrip调试技巧之断点调试
Oct 22 Javascript
JS模态窗口返回值兼容问题的完美解决方法
May 28 Javascript
jQuery手风琴的简单制作
May 12 jQuery
chorme 浏览器记住密码后input黄色背景处理方法(两种)
Nov 22 Javascript
jQuery第一次运行页面默认触发点击事件的实例
Jan 10 jQuery
vue操作下拉选择器获取选择的数据的id方法
Aug 24 Javascript
javascrit中undefined和null的区别详解
Apr 07 Javascript
Vue侦测相关api的实现方法
May 22 Javascript
JavaScript实现tab栏切换效果
Mar 16 Javascript
angular2中router路由跳转navigate的使用与刷新页面问题详解
May 07 #Javascript
Angular2中select用法之设置默认值与事件详解
May 07 #Javascript
Angular.JS中指令ng-if、ng-show/ng-hide和ng-switch的使用教程
May 07 #Javascript
Angular.Js中ng-include指令的使用与实现
May 07 #Javascript
Angular.js中ng-include用法及多标签页面的实现方式详解
May 07 #Javascript
JavaScript的继承实现小结
May 07 #Javascript
vue2.0多条件搜索组件使用详解
Mar 26 #Javascript
You might like
php自定义加密与解密程序实例
2014/12/31 PHP
php json_encode与json_decode详解及实例
2016/12/13 PHP
php中类和对象:静态属性、静态方法
2017/04/09 PHP
php实现微信公众平台发红包功能
2018/06/14 PHP
判断JavaScript对象是否可用的最正确方法分析
2008/10/03 Javascript
MooTools 页面滚动浮动层智能定位实现代码
2011/08/23 Javascript
js出生日期 年月日级联菜单示例代码
2014/01/10 Javascript
js 动态为textbox添加下拉框数据源的方法
2014/04/24 Javascript
jQuery validate插件功能与用法详解
2016/12/15 Javascript
Bootstrap源码解读网格系统(3)
2016/12/22 Javascript
获取当前月(季度/年)的最后一天(set相关操作及应用)
2016/12/27 Javascript
JavaScript实现快速排序的方法分析
2018/01/10 Javascript
详解angularjs 学习之 scope作用域
2018/01/15 Javascript
Node.js使用MySQL连接池的方法实例
2018/02/11 Javascript
vue 实现全选全不选的示例代码
2018/03/29 Javascript
利用vue重构有赞商城的思路以及总结整理
2019/02/21 Javascript
详解如何在vue项目中使用layui框架及采坑
2019/05/05 Javascript
nodejs使用node-xlsx生成excel的方法示例
2019/08/22 NodeJs
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
2020/01/26 Javascript
JS Array.from()将伪数组转换成数组的方法示例
2020/03/23 Javascript
[01:15:00]LGD vs Mineski Supermajor 胜者组 BO3 第一场 6.5
2018/06/06 DOTA
Python切片工具pillow用法示例
2018/03/30 Python
pytorch之添加BN的实现
2020/01/06 Python
python实现横向拼接图片
2020/03/23 Python
浅谈Html5移动端ios/Android兼容性总结
2018/06/01 HTML / CSS
中国电子产品外贸网站:MiniIntheBox
2017/02/06 全球购物
.net面试题
2016/09/17 面试题
市场营销专科应届生求职信
2013/11/24 职场文书
初中生物教学反思
2014/01/10 职场文书
项目建议书格式
2014/03/12 职场文书
打造高效课堂实施方案
2014/03/22 职场文书
关于清明节的演讲稿
2014/09/13 职场文书
2014幼儿园班主任工作总结
2014/12/04 职场文书
SqlServer数据库远程连接案例教程
2021/07/15 SQL Server
解决Python保存文件名太长OSError: [Errno 36] File name too long
2022/05/11 Python
JavaScript架构localStorage特殊场景下二次封装操作
2022/06/21 Javascript