Question

如何使用angular.js？

按自动编号字段删除记录

情境：

默认页面是：

enter image description here

当我将记录推送到$ scope.users时：

enter image description here

$scope.user={
   Name:stackoverflow,
   Family:stackoverflow.com,
   ID:undefined
}

然后会显示记录：

enter image description here

当我想删除记录时，会发生以下错误：

参数字典包含参数'id'的空条目方法'Void DeleteUser（Int32）'的非可空类型'System.Int32' 在'Angular_02.Controllers.UserController'中。必须有一个可选参数是引用类型，可空类型，或声明为可选参数。参数名称：参数

因为ID字段未定义

将用户代码删除到服务器中：

[HttpPost]
public void DeleteUser(int id)
{
  var userService=new UserService();
  userService.Delete(id);
}

如何修复此错误？我一直在努力寻找，但却没有找到任何帮助。哪里错了？我真的不知道该怎么办。我在下面写了所有细节。我尝试过但没有成功。

app.js文件：

var app = angular.module('myApp', ['ngAnimate']);
app.controller("UserController", function ($scope, $http) {

    $scope.users = "";
    $scope.user = "";

    // Get User Scope
    var getUsersRequest = $http({
        method: "get",
        url: "/User/GetUsers",
    });

    getUsersRequest.success(
        function (data) {
            $scope.users = data;
        }
    );
    // End Get User Scope


    // Add User Scope

    $scope.addUser = function (user) {

        var addUserRequest = $http({
            method: "post",
            url: "/User/AddUser",
            data: user
        });

        addUserRequest.success(
            function () {
                $scope.users.push(user);
                $scope.user = "";
            }
        );
    };
    // End Add User Scope

    // Delete User Scope
    $scope.deleteUser = function (id, index) {
        var addUserRequest = $http({
            method: "post",
            url: "/User/DeleteUser",
            data: { "id": id }
        });

        addUserRequest.success(
            function () {
                $scope.users.splice(index, 1);
            }
        );
    };
    // End Delete User Scope
});

html代码：

<div ng-controller="UserController" ng-app="myApp">
    <span>Count :  {{users.length}} User</span>
    <div ng-repeat="user in users">
        <span>Name : {{user.Name}}</span>
        <span>Family : {{user.Family}}</span>
        <section style="float: left;" ng-click="deleteUser(user.ID,$index);">
            <a href="Javascript:void(0)">Delete</a>
        </section>
    </div>

    <form name="userForm" ng-submit="addUser(user)">
        <input class="form-control" ng-model="user.Name" placeholder="Name" />
        <input class="form-control" ng-model="user.Family" placeholder="Family" />
        <button type="submit" class="btn btn-primary">Add User</button>
    </form>
</div>

我的表格脚本：

CREATE TABLE [dbo].[Users](
    [ID] [int] IDENTITY(1,1) NOT NULL,
    [Name] [nvarchar](max) NOT NULL,
    [Family] [nvarchar](max) NOT NULL,
 CONSTRAINT [PK_dbo.Users] PRIMARY KEY CLUSTERED 
(
    [ID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY] TEXTIMAGE_ON [PRIMARY]

更新：

在服务中添加用户：

private UserContext _userContext;
        public void Add(User user)
        {
            using (_userContext = new UserContext())
            {
                _userContext.Users.Add(user);
                _userContext.SaveChanges();
            }
        }

Answer 1

我不确定你的行动是如何寻找添加新用户的，但可能是：

[HttpPost]
public User AddUser(User user)
{
  var userService=new UserService();
  userService.AddUser(user);
  userService.Comit();
// make sure that you return created user
return user
}

然后在你的js部分

 $scope.addUser = function (user) {

         $http.post("/User/AddUser",user).then(function(response){
               $scope.users.push(response.data);
                $scope.user = {};

        });               

    };
// End Add User Scope

如果这不起作用，请从服务器端发布你的addUser操作。

Answer 2

您没有显示“添加用户”网络服务。添加用户Web服务的响应应该返回数据库中存在的用户（或至少是用户ID）。通过向客户端发送新ID，您现在可以获得足够的信息来删除用户。

使用angular.js按AutoNumber字段删除记录

2 个答案: