AngularJS：多個表單的服務器端驗證
[英]AngularJS: Server-side validation of multiple forms
問題描述
<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>
在sumbit我發送：
{
[
{ 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-）表格由ng-repeat創建怎么辦？
1 個解決方案
解決方案1
0 2014-03-04 22:14:55
如果要根據服務器響應顯示錯誤消息，則可以執行此操作
將服務器響應分配給
$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>
服務器端用戶輸入驗證
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.