angularjs表单提交数据为空

有一个表单元素

<form name="myForm" ng-submit="subMe()"> 
    <input type="text" name="name" value="" /> 
</form>

和

$scope.subMe = function(){ 
    console.log($scope.myForm); // return empty object as {} 
}

所以，我怎么能在形式看到数据？将来会有许多投入要素。

并且是检查后端有效表单的最佳做法吗？做一些像：

var _valid = $http.post(); 
if (_valid) { 
    if (createUserSuccess()){ 
    showSucceess(); 
    } else { 
    showError(); 
    } 
} else { 
    showBadFilledFormElements(); 
}

谢谢！

来源

2014-10-28 user3454794

你没有提交输入或按钮，所以ng-submit是不是你会用来查看表单数据。

在窗体的范围内初始化一个空的对象，像这样

myApp.controller('formController', function($scope) { 
    $scope.formData = {}; 

    $scope.submitForm = function() { 
     //do stuff on submit 
    } 
});

然后绑定ng-model在您的标记，像这样

<div ng-controller="formController"> 
    <form name="myForm" ng-submit="submitForm()"> 
     <input type="text" name="name" ng-model="formData.name" value="" /> 
     <button type="submit">Submit</button> 
    </form> 
    {{formData}} 
</div>

您可以在标记与{{formData}}查看，内formController

编辑：更改提交表单函数名称，使更有意义。

来源

2014-10-28 22:00:44 cpk

您需要将模型添加到您的表单的输入元素：

<form name="myForm" ng-submit="subMe()"> 
    <input type="text" name="name" value="" ng-model="myForm.name" /> 
    <input type="text" name="email" value="" ng-model="myForm.email" /> 
</form>

和

$scope.subMe = function(){ 
    console.log($scope.myForm); // { name: "abc", email: "[email protected]"} 
}

我不知道我理解你的问题的第二部分，但你会想创建一个Angular Service获取将表单数据提交给您的api时的最佳做法。

来源

2014-10-28 21:56:16

Eric Olson的回答非常正确。我只想在这里添加一些东西。你可能会想结帐ngForm

ngForm

形式指令的嵌套别名。 HTML不允许嵌套表单元素。例如，如果需要确定控制子组的有效性，则嵌套表单非常有用。

注意：ngForm的目的是对控件进行分组，但不能替代具有所有功能的标签（例如发布到服务器......）。

来源

2014-10-28 22:49:32 stevemao

angularjs表单提交数据为空

回答

相关问题