使用错误的ng-pattern重置angularjs表单字段

时间:2015-03-19 17:59:13

标签: javascript angularjs forms reset ng-pattern

`http://plnkr.co/edit/kAt9B3GrO8m8TT7lUHt6?p=preview`

嘿朋友们,您能否告诉我如何以较少的步骤重置表单值,而不是让每个值都为空?

我有一个允许使用字母的模式,当我尝试重置表单时,我希望输入和它的错误消息都消失了。 $ setPristine只有在我输入正确的模式并重置时才会清除表单,但我希望错误的输入如453453 / = - = - 在重置时与错误样式一起消失。

请帮助..

2 个答案:

答案 0 :(得分:1)

如果要重置所有字段,可以按照角度文档示例使用母版复制数据。

如果您只想重置无效字段,则需要检查每个字段并在它们无效时重置它们。

更新您的plunker。

var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope, $compile) {
  'use strict';
  $scope.master = {
    name: ""
  };
  $scope.data = angular.copy($scope.master);
  $scope.reset = function() {
    $scope.data = angular.copy($scope.master);
    $scope.form.$setPristine();
  }
});

http://plnkr.co/edit/3gFGSjA9kArzn7uNanIu?p=preview

答案 1 :(得分:1)

我已经解决了这个问题如下:

var input = angular.element('#[inputId]').val(); 

以这种方式,您可以访问每个无效字段的值,并仅在范围中的值未定义时才检查此值。在我的情况下,所有范围字段都先配置为null值,这样我很容易识别出ng-pattern指令无效的字段。

示例:

$scope.reset = function() {
   if($scope.formValues === undefined){
    var input1 = angular.element('#inputId1').val("");
    var input2 = angular.element('#inputId2').val("");
   }
   else{
   ...
   }
}