AngularJs实现sqlserver的增删改查--C#

最新推荐文章于 2019-04-04 07:50:57 发布

氏张

最新推荐文章于 2019-04-04 07:50:57 发布

阅读量888

点赞数 1

分类专栏：初步学习文章标签： Angularjs C#

本文链接：https://blog.csdn.net/z1061998175/article/details/80306280

版权

初步学习专栏收录该内容

20 篇文章 0 订阅

订阅专栏

前台代码:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body ng-app="app" ng-controller="MyCtrl">

    <input type="text" placeholder="名字" ng-model="Sname" />
    <input type="button" value="提交" ng-click="insert(Sname)" />
    <table style="width:100%;background-color:aqua;text-align:center">
        <tr style="color:white">
            <td>Id</td>
            <td>Name</td>
            <td>操作</td>
        </tr>
        <tr style="background-color:white" ng-repeat="item in list">
            <td>{{item.id}}</td>
            <td>{{item.name}}</td>
            <td>
                <input type="button" value="删除" ng-click="remove(item.id)" data-id="{{item.id}}" />
                <input type="button" value="修改" ng-click="u(item)" />
            </td>
        </tr>
    </table>
    <hr />
    <input type="text" ng-model="se.name" placeholder="名字" />
    <input type="button" value="修改" ng-click="update()" />
    <input type="text" ng-model="se.id" hidden="hidden" />
</body>
</html>
<script src="js/angular.min.js"></script>  //我的angular.min为本地,可以去官网进行下载适用到本地
<script src="js/All.js"></script>

All.js代码

angular.module("app", [])
    .controller("MyCtrl", function ($scope, $http) {
        $scope.Sname = ""; //定义一个用来放入数据库的对象
        $scope.se = {}; //定义一个用来放入文本框的集合

        $http.get("odata/Use").then(function (data) { //查询全部数据
            $scope.list = data.data.value;
        })

        $scope.remove = function (id) { //进入到方法里进行删除
            $http.delete("odata/Use(" + id + ")") //给后台一个id进行查询删除
                .then(function () { 
                    window.location = location
                    alert("删除成功")
                })
        }
        $scope.insert = function (s) {  //进入到方法里进行添加
            $scope.name = { "name": s } //前端带过来一个值,也可以多个,json结构
            $http.post("odata/Use", $scope.name)  //给后台一个对象
                .then(function () {
                    window.location = location
                    alert("添加成功")
                })
        }
        $scope.update = function () {  //进入到方法里进行修改
            $http.put("odata/Use(" + $scope.se.id + ")", $scope.se) //给后台一个id进行查询后,在给后台一个已经修改的对象进行修改
                .then(function () {
                    window.location = location
                    alert("修改成功!")
                })
        }
        $scope.u = function (st) { //把item的值赋给$scope.se
            $scope.se = st;
        }
 //then为返回方法
    })

后台代码(UseController.cs)

 public class UseController : ODataController
    {
        UseContext ue = new UseContext(); //定义一个context进行数据库的操作
        [EnableQuery] //返回一个集合
        public IQueryable<Use> Get() //获取全部数据
        {
            return ue.Uses;
        }
        //增
        public async Task<IHttpActionResult> Post(Use u) //从前台带过来一个对象,进行数据库的添加
        {
            if (!ModelState.IsValid) //验证数据是否正确
                return BadRequest(ModelState); //不正确
            ue.Uses.Add(u); //正确就添加
            await ue.SaveChangesAsync(); //提交
            return Created(u);
        }
        //删
        public async Task<IHttpActionResult> Delete([FromODataUri] int key) //从前台带过来一个id
        {
            var s = await ue.Uses.FindAsync(key); //查询id是否存在
            if (s == null) return NotFound(); //不存在
            ue.Uses.Remove(s); //存在删除
            await ue.SaveChangesAsync(); //提交
            return StatusCode(HttpStatusCode.NoContent);
        }
        //改
        public async Task<IHttpActionResult> Put([FromODataUri] int key, Use s) //从前台带过来一个id和一个已经修改过的对象
        {
            if (!ModelState.IsValid) return BadRequest(ModelState); //验证前台数据是否符合
            if (key != s.id) return BadRequest();//判断前台id是否存在
            ue.Entry(s).State = EntityState.Modified; //存在添加
            try
            {
                await ue.SaveChangesAsync(); //提交
            }
            catch (DbUpdateConcurrencyException)
            {
                if (!ProductExists(key)) return NotFound();
                else throw;
            }
            return Updated(s);
        }

        private bool ProductExists(int key)
        {
            return ue.Uses.Any(r => r.id == key); //再次查询id
        }
    }

氏张

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
AngularJs实现sqlserver的增删改查--C#

前台代码:&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;&lt;/title&gt;&lt;/head&gt;&lt;body ng-app="app" ng-controller="
复制链接

扫一扫