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 字符编码规则
May 04 Javascript
ext checkboxgroup 回填数据解决
Aug 21 Javascript
jquery 元素相对定位代码
Oct 15 Javascript
js实现俄罗斯方块小游戏分享
Jan 31 Javascript
js post提交调用方法
Feb 12 Javascript
仅30行代码实现Javascript中的MVC
Feb 15 Javascript
Bootstrap Table表格一直加载(load)不了数据的快速解决方法
Sep 17 Javascript
浅谈JavaScript中的apply/call/bind和this的使用
Feb 26 Javascript
JavaScript实现的原生态Tab标签页功能【兼容IE6】
Sep 18 Javascript
关于AngularJS中ng-repeat不更新视图的解决方法
Sep 30 Javascript
Vue实现点击显示不同图片的效果
Aug 10 Javascript
JS Web Flex弹性盒子模型代码实例
Mar 10 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学习 运算符与运算符优先级
2008/06/15 PHP
PHP性能优化准备篇图解PEAR安装
2011/12/05 PHP
5种PHP创建数组的实例代码分享
2014/01/17 PHP
php实现的Curl封装类Curl.class.php用法实例分析
2015/09/25 PHP
Laravel框架查询构造器简单示例
2019/05/08 PHP
JAVASCRIPT 对象的创建与使用
2021/03/09 Javascript
Javascript基础教程之定义和调用函数
2015/01/18 Javascript
JavaScript实现的伸展收缩型菜单代码
2015/10/14 Javascript
jQuery随手笔记之常用的jQuery操作DOM事件
2015/11/29 Javascript
JavaScript预解析及相关技巧分析
2016/04/21 Javascript
jquery文字填写自动高度的实现方法
2016/11/07 Javascript
JS获取鼠标位置距浏览器窗口距离的方法示例
2017/04/11 Javascript
jQuery扩展_动力节点Java学院整理
2017/07/05 jQuery
CheckBox多选取值及判断CheckBox选中是否为空的实例
2017/10/31 Javascript
基于JavaScript实现五子棋游戏
2020/08/26 Javascript
JS获取指定月份的天数两种实现方法
2018/06/22 Javascript
vue项目中使用rem,在入口文件添加内容操作
2020/11/11 Javascript
使用python实现拉钩网上的FizzBuzzWhizz问题示例
2014/05/05 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
influx+grafana自定义python采集数据和一些坑的总结
2018/09/17 Python
Python全局锁中如何合理运用多线程(多进程)
2019/11/06 Python
python求前n个阶乘的和实例
2020/04/02 Python
keras中的卷积层&amp;池化层的用法
2020/05/22 Python
Python操作Elasticsearch处理timeout超时
2020/07/17 Python
Ever New美国:澳大利亚领先的女装时尚品牌
2019/11/28 全球购物
办护照工作证明范本
2014/01/14 职场文书
大型营销活动计划书
2014/04/28 职场文书
技术比武方案
2014/05/19 职场文书
民政局个人整改措施
2014/09/24 职场文书
Redis如何一键部署脚本
2021/04/12 Redis
MySQL5.7并行复制原理及实现
2021/06/03 MySQL
基于Python和openCV实现图像的全景拼接详细步骤
2021/10/05 Python
Python经常使用的一些内置函数
2022/04/11 Python
使用Python获取字典键对应值的方法
2022/04/26 Python
MySQL 执行数据库更新update操作的时候数据库卡死了
2022/05/02 MySQL
HTML页面中使两个div并排显示的实现
2022/05/15 HTML / CSS