AngularJS：多种形式的服务器端验证

<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>

在透过我送：AngularJS：多种形式的服务器端验证

{ 
    [ 
    { name: "CakeA", price: 111}, 
    { name: "CakeB", price: 222} 
    ] 
}

服务器的回应是：

{ 
    [ 
     { isCakeOk: true }, 
     { isCakeOk: false, errors: [{ name: "That's a bad name for a cake" }] } 
    ] 
}

现在，我需要设置 'serverValidation' 在$错误正确的输入形式。我该怎么做？在一个单一的表单中，我会使用bigForm.cakeName。$ setValidity（'serverValidation'，false），但是如果我有很多由ng-repeat创建的（ng-）表单呢？

来源

2014-03-04 Pawel

如果你想显示基于服务器响应的错误信息，那么你就可以做到这一点

指定服务器效应初探至

$scope.cakes = [ 
       { isCakeOk: true }, 
       { isCakeOk: false, errors: [{ name: "That's a bad name for a cake" }] } 
       ];

提交操作之后。

类似地，您可以将错误类分配给输入/标签以让用户知道错误。

如果您要访问这样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>

NG重复的表单元素使用

来源

2014-03-04 22:14:55

AngularJS：多种形式的服务器端验证

回答

相关问题