Javascript AngularJS PUT起作用，POST返回未定义的范围值

使用这些代码，我可以更新列出的用户，但是添加新用户不起作用。新项目的输入范围始终未定义。它确实在表单中提交了一些东西，但没有我填写的值。例如，

console.log（$scope.newMail）

return

undefined

<script>
function UsersController($scope, $http, $location) {
    $http.get('/users').success(function(users) {
        $scope.users = users;
    });

    $scope.addUser = function(user) {
        var user = {
            name:   $scope.newName, // with hardcoding values here it does work
            email:      $scope.newMail // but with newValues, both stay null always
        };
        console.log(user); // returns undefined values
        $http.post('/users', user);
    }

    $scope.updateUser = function(user) {
        $http.put('/users/'+user.id, user);
    }
}
</script>


<section ng-controller="UsersController">

    <!-- ng-repeat -->
    <div ng-repeat="user in users">
        <form ng-submit="updateUser(user)">

            <input type="hidden" ng-model="user.id" value="{{ user.id }}"/>
            <input type="text" value="{{ user.name }}" ng-model="user.name" />
            <input type="email" value="{{ user.email }}" ng-model="user.email" />

            <button type="submit" />
        </form>


        <section ng-show="toggleForm">

            <form ng-submit="addUser(user)">
                <input type="text" ng-model="newName" required />
                <input type="email" ng-model="newMail" required />

                <button type="submit" ng-click="toggleForm = !toggleForm"/>
            </form>

        </section>

        <a ng-click="toggleForm = !toggleForm"><p>New user</p></a>

    </div>
</section>

函数UsersController（$scope、$http、$location）{
$http.get（'/users'）.success（函数（用户）{
$scope.users=用户；
});
$scope.addUser=函数（用户）{
变量用户={
name:$scope.newName，//使用此处的硬编码值，它可以工作
email:$scope.newMail//但对于newvalue，两者都始终保持为null
};
console.log（user）；//返回未定义的值
$http.post（'/users'，user）；
}
$scope.updateUser=函数（用户）{
$http.put（'/users/'+user.id，user）；
}
}
我认为您的问题在于范围继承。因此，应该有两种选择：

备选方案#1
使用一个对象（例如newuser）并将输入绑定到该对象，这样就可以将其作为一个整体发送到控制器方法

HTML



备选方案2
我怀疑表单正在创建一个新的子作用域，因此这就是值返回未定义的原因。您可以显式绑定到$parent作用域，以便控制器中的方法可以看到它

<form ng-submit="addUser(user)">
    <input type="text" ng-model="$parent.newName" required />
    <input type="email" ng-model="$parent.newMail" required />

    <button type="submit" ng-click="toggleForm = !toggleForm"/>
</form>

你确定你的后端服务按预期工作吗？是。用卷发试试，效果很好。它确实提交了一些内容，但具有空值。当我执行
console.log（$scope.newMail）时
，然后我在控制台中得到
未定义的
。但是当您现在使用addUser添加一些东西时，成功了。如果您想添加一个新项，那么表单仍然与上次添加的项具有相同的值。当您更改表单中的文本时，该项列表中的文本也会更改。当你想添加一个新用户时，有没有办法得到一个全新的表单<代码>错误：[ngRepeat:dupes]中继器中不允许重复。使用“track by”表达式指定唯一键。
您可以使用$index创建单个“newUsers”，查看更新答案上的备选方案3。但是我不能再打字了：你能设置一个Plunker吗？然后我们可以解决这个问题。我在ng repeat中添加了以下内容：
ng repeat=“user in users track by$index”
。请参阅startpost中的“我的编辑”。
<form ng-submit="addUser(newuser)">
    <input type="text" ng-model="newuser.name" required />
    <input type="email" ng-model="newuser.mail" required />

    <button type="submit" ng-click="toggleForm = !toggleForm"/>
</form>

$scope.addUser = function(user) {
    $http.post('/users', user);
}

<form ng-submit="addUser(user)">
    <input type="text" ng-model="$parent.newName" required />
    <input type="email" ng-model="$parent.newMail" required />

    <button type="submit" ng-click="toggleForm = !toggleForm"/>
</form>

<form ng-submit="addUser(newuser[$index])">
    <input type="text" ng-model="newuser[$index].name" required />
    <input type="email" ng-model="newuser[$index].mail" required />

    <button type="submit" ng-click="toggleForm = !toggleForm"/>
</form>

$scope.newuser = {};
$scope.addUser = function(user) {
    $http.post('/users', user);
}