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变量作用域更轻松
Oct 25 Javascript
js 加载并解析XML字符串的代码
Dec 13 Javascript
js闭包的用途详解
Nov 09 Javascript
node.js中的fs.stat方法使用说明
Dec 16 Javascript
jQuery判断指定id的对象是否存在的方法
May 22 Javascript
JS+CSS实现仿雅虎另类滑动门切换效果
Oct 13 Javascript
Node.js DES加密的简单实现
Jul 07 Javascript
详解用vue编写弹出框组件
Jul 04 Javascript
JavaScript运行原理分析
Feb 09 Javascript
vue路由导航守卫和请求拦截以及基于node的token认证的方法
Apr 07 Javascript
原生JavaScript实现的无缝滚动功能详解
Jan 17 Javascript
vue打开子组件弹窗都刷新功能的实现
Sep 21 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之第十天
2006/10/09 PHP
PHP中全面阻止SQL注入式攻击分析小结
2012/01/30 PHP
无法在发生错误时创建会话,请检查 PHP 或网站服务器日志,并正确配置 PHP 安装(win+linux)
2012/05/05 PHP
php的crc32函数使用时需要注意的问题(不然就是坑)
2015/04/21 PHP
php实现的rc4加密解密类定义与用法示例
2018/08/16 PHP
jQuery链式操作如何实现以及为什么要用链式操作
2013/01/17 Javascript
JavaScript实现的in_array函数
2014/08/27 Javascript
JavaScript设计模式之工厂模式和构造器模式
2015/02/11 Javascript
Javascript中的高阶函数介绍
2015/03/15 Javascript
JS实现淡蓝色简洁竖向Tab点击切换效果
2015/10/06 Javascript
javascript中Number的方法小结
2016/11/21 Javascript
原生js编写2048小游戏
2017/03/17 Javascript
require.js中的define函数详解
2017/07/10 Javascript
vue实现点击图片放大效果
2017/08/15 Javascript
微信小程序实现tab切换效果
2017/11/21 Javascript
AngularJS2 与 D3.js集成实现自定义可视化的方法
2017/12/01 Javascript
AngularJS与BootStrap模仿百度分页的示例代码
2018/05/23 Javascript
vue的过滤器filter实例详解
2018/09/17 Javascript
微信小程序与公众号卡券/会员打通的问题
2019/07/25 Javascript
Javascript原型链及instanceof原理详解
2020/05/25 Javascript
如何利用JS将手机号中间四位变成*号
2020/09/29 Javascript
在Python中处理XML的教程
2015/04/29 Python
python中for语句简单遍历数据的方法
2015/05/07 Python
pandas ix &amp;iloc &amp;loc的区别
2019/01/10 Python
Django接收post前端返回的json格式数据代码实现
2019/07/31 Python
Python实现数值积分方式
2019/11/20 Python
使用Django清空数据库并重新生成
2020/04/03 Python
keras输出预测值和真实值方式
2020/06/27 Python
马来西亚网上美容店:Hermo.my
2017/11/25 全球购物
美国在线旅行社:Crystal Travel
2018/09/11 全球购物
会计专业应届生求职信
2013/11/24 职场文书
优秀学生干部推荐材料
2014/02/03 职场文书
技能比武方案
2014/05/21 职场文书
科长个人四风问题整改措施思想汇报
2014/10/13 职场文书
文明单位汇报材料
2014/12/24 职场文书
创业计划书之便利店
2019/09/05 职场文书