Question

这项任务有点原始。

我得到了一个带有各种输入的简单Angular表单，并且我想手动突出显示无效输入（例如，在提交操作时）。

我试图循环无效输入，假设他们必须有一些方法来突出显示错误，但不幸的是他们没有。

与表格相同。 $setDirty()也没有效果。

我使用ng-form指令来访问表单和输入。

AngularJS版本是1.2.x。

Answer 1

你形成标记应该是这样的，所以当你点击提交ng-class时，会在submitted上添加form课程，这会让你知道每当你在表格和字段上提交课程时ng-invalid类，您可以突出显示那些元素

<强>标记

<ng-form name="form" ng-class="{submitted: submitted}" ng-submit="submitted=true; submit();">
   <input type="text" name="firstname" ng-model="formData.firstname">
   <input type="text" name="lastname" ng-model="formData.lastname">
   <input type="submit" value="submit">
</ng-form>

<强> CSS

.submitted input.ng-invalid {
   border: solid 1px red;
}

Answer 2

使用 ng-pattern 和必需，它会检查您的验证。和onSubmiy你也可以自定义你的验证

示例：http://jsfiddle.net/kevalbhatt18/dmo1jg02/

的

的
<div ng-app ng-controller="formCtrl"> <form name="myForm" ng-submit="onSubmit()"> <input type="number" ng-model="price" name="price_field" ng-pattern="/^[0-9]{1,7}$/" required> <span ng-show="myForm.price_field.$error.pattern">Not a valid number!</span> <input type="submit" value="submit"/> </form> </div>

的

的js

的

的
function formCtrl($scope){ $scope.onSubmit = function(){ alert("form submitted"); } }

的

手动突出显示Angular Form的所有无效输入

2 个答案: