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 相关文章推荐
jquery实现的让超出显示范围外的导航自动固定屏幕最顶上
Sep 22 Javascript
关于js datetime的那点事
Nov 15 Javascript
jQuery 菜单随滚条改为以定位方式(固定要浏览器顶部)
May 24 Javascript
简约JS日历控件 实例代码
Jul 12 Javascript
从零学JS之你需要了解的几本书
May 19 Javascript
JS多物体实现缓冲运动效果示例
Dec 20 Javascript
JS图片轮播与索引变色功能实例详解
Jul 06 Javascript
bootstrap table实现x-editable的行单元格编辑及解决数据Empty和支持多样式问题
Aug 10 Javascript
生产制造追溯系统之在线打印功能
Jun 03 Javascript
在Vue中创建可重用的 Transition的方法
Jun 02 Javascript
微信小程序实现弹幕墙(祝福墙)
Nov 18 Javascript
vue开发chrome插件,实现获取界面数据和保存到数据库功能
Dec 01 Vue.js
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
substr()函数中文版
2006/10/09 PHP
javascript 基础篇4 window对象,DOM
2012/03/14 Javascript
JSON无限折叠菜单编写实例
2013/12/16 Javascript
file控件选择上传文件确定后触发的js事件是哪个
2014/03/17 Javascript
jquery实现显示已选用户
2014/07/21 Javascript
javascript实现随机生成DIV背景色
2016/06/20 Javascript
关于JS 预解释的相关理解
2016/06/28 Javascript
关于JS中二维数组的声明方法
2016/09/24 Javascript
JavaScript队列函数和异步执行详解
2017/06/19 Javascript
jQuery实现对网页节点的增删改查功能示例
2017/09/18 jQuery
vue-cli 目录结构详细讲解总结
2019/01/15 Javascript
最简单的vue消息提示全局组件的方法
2019/06/16 Javascript
angular异步验证防抖踩坑实录
2019/12/01 Javascript
[04:48]DOTA2亚洲邀请赛林书豪为VGJ加油
2017/04/01 DOTA
一行代码让 Python 的运行速度提高100倍
2018/10/08 Python
Python sklearn KFold 生成交叉验证数据集的方法
2018/12/11 Python
python shutil文件操作工具使用实例分析
2019/12/25 Python
TensorFlow固化模型的实现操作
2020/05/26 Python
python如何设置静态变量
2020/09/07 Python
美国一家主营日韩美妆护肤品的在线商店:iMomoko
2016/09/11 全球购物
SmartBuyGlasses丹麦:网上购买名牌太阳镜、眼镜和隐形眼镜
2016/10/01 全球购物
享誉全球的多元化时尚精品购物平台:Farfetch发发奇(支持中文)
2017/08/08 全球购物
意大利大型购物中心:Oliviero.it
2017/10/19 全球购物
戴森台湾线上商城:Dyson Taiwan
2018/05/21 全球购物
英国最大的专业户外零售商:Mountain Warehouse
2018/06/06 全球购物
可靠的数据流传输TCP
2016/03/15 面试题
init进程的作用
2012/04/12 面试题
学校安全教育月活动总结
2014/07/07 职场文书
学生考试舞弊检讨书
2015/01/01 职场文书
运动会开幕词
2015/01/28 职场文书
2015年团支书工作总结
2015/04/03 职场文书
大学军训通讯稿
2015/07/18 职场文书
采购部年度工作总结
2015/08/13 职场文书
Python使用华为API为图像设置多个锚点标签
2022/04/12 Python
Java由浅入深通关抽象类与接口(下篇)
2022/04/26 Java/Android
Elasticsearch6.2服务器升配后的bug(避坑指南)
2022/09/23 Servers