Question

验证AngularJS中所有字段的最佳方法是什么。

我有一个包含7个字段的表单，并且所有字段都是必填字段，如果任何字段无效，我想显示错误消息或更改边框。

我使用以下方法。请告诉我这是正确的方法。如果明天我有100个领域怎么办。

if(!($scope.signInForm.email.$valid)){
    $scope.emailError = true;
}
else {
    $scope.emailError = false;
}
if(!($scope.signInForm.password.$valid)){
    $scope.passwordError = true;
}
else {
    $scope.passwordError = false;
}

Answer 1

您可以在模板中处理此问题，请参阅文档中的更多信息： https://docs.angularjs.org/guide/forms

来自文档

<form name="myForm" class="css-form" novalidate>
  <div>
    <input type="email" name="input" ng-model="email.text" required>

    <span class="error" ng-show="myForm.input.$error.required">
        Required!
    </span>
    <span class="error" ng-show="myForm.input.$error.email">
        Not valid email!
    </span>
  </div>
  ...

  <!-- If you want to disable the button until all fields are filled in correctly.-->
  <button class="btn btn-default" ng-disabled="myForm.$invalid">Login</button>
</form>

正如Alex所说，查看ngMessages也是一个好主意，您可以在此处找到有用的信息：http://blog.thoughtram.io/2015/06/06/ng-messages-revisited.html

Answer 2

  newuser = new FormGroup({
    firstname: new FormControl(''),
    lastname: new FormControl(''),
    usertype: new FormControl(''),
    phoneno: new FormControl(''),
    city: new FormControl(''),
    zip: new FormControl(''),
    agree:new FormControl('')
  });




  submitform(){
    if(this.newuser.status=="VALID"){
        console.log(this.newuser.value);   
    }   
  }

使用AngularJs中的所有字段验证表单

2 个答案: