<form name="bigForm" ng-submit="submit()">
<div class="form" ng-repeat="cake in cakes">
<ng-form name="innerForm">
<input type="text" name="cakeName" ng-model="cake.name">
<input type="number" name="cakePrice" ng-model="cake.price">
</ng-form>
</div>
<button type="submit">Submit</button>
</form>
在提交时我发送:
{
[
{ name: "CakeA", price: 111},
{ name: "CakeB", price: 222}
]
}
服务器响应是:
{
[
{ isCakeOk: true },
{ isCakeOk: false, errors: [{ name: "That's a bad name for a cake" }] }
]
}
现在，我想以正确的形式在正确的输入上设置“serverValidation”$error。我该怎么做？在单一表单中，我会使用 bigForm.cakeName.$setValidity('serverValidation', false)，但如果我有许多由 ng-repeat 创建的 (ng-) 表单怎么办？
最佳答案
如果你想根据服务器响应显示错误信息，那么你可以这样做
将服务器响应分配给
$scope.cakes = [
{ isCakeOk: true },
{ isCakeOk: false, errors: [{ name: "That's a bad name for a cake" }] }
];
提交操作后。
类似地，您可以将错误类别分配给输入/标签，让用户知道错误。
如果你想访问 ng-repeat 表单元素，请像这样使用 bigForm.innerForm.cakeName
<script>
var formApp = angular.module('formApp',[]);
formApp.controller("FormController",function($scope){
$scope.cakes = [{ name: "CakeA", price: 111},{ name: "CakeB", price: 222}];
});
</script>
<body ng-controller="FormController">
<div class="form-container">
<form name="bigForm" ng-submit="submit()">
<div class="form" ng-repeat="cake in cakes">
<ng-form name="innerForm">
<input type="text" name="cakeName" ng-model="cake.name" ng-required="true">
<span class="error">{{cake.errors[0].name}}</span>
<input type="number" name="cakePrice" ng-model="cake.price">
</ng-form>
</div>
<button type="submit">Submit</button>
</form>
</div>
</body>
关于javascript - AngularJS:多种形式的服务器端验证，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22178942/