角度形式验证 - ng-valid 开始

Question

我正在使用 angular-auto-validate 并且遇到了一些状态管理问题。我有一个多部分表单，其中需要一些字段（姓名/电子邮件地址），并且用户可以“返回”以更改答案。基本上，我对表格中的每个阶段都有一个部分，它运行良好，但有一个例外。如果该字段无效，则继续按钮将被禁用。我尝试简单地使用 $valid 标识符，但是当部分加载时，每个字段都以 ng-valid 开头，所以我可以使用 $touched 或 $pristine。问题是，当用户返回时，绑定到数据源的值是有效的，但没有触及该字段，因此不会激活继续按钮。示例代码（这是我点击“返回”按钮后生成的代码）：

<input type="text" name="name" ng-minlength="3" ng-model="myModel" placeholder="Your First Name" ng-focus="inputFocused()" ng-pattern-err-type="" ng-model-options="{updateOn: 'blur'}" class="ng-valid ng-valid-pattern ng-valid-minlength">

和按钮：

<a href="/#/setup" class="button round" ng-class="{'disabled': !signupForm.name.$valid || !signupForm.name.$touched }" ng-click="completeStep()">Continue</a>

如何禁用默认 ng-valid 或识别控制器填充值的条件？

Answer 1

我认为你应该使用 ng-dirty/pristine。您可以在用户导航时手动设置表单的条件。 当您填充表单数据时，您可以执行以下操作：

if($scope.myForm.data) {
  $scope.myForm.$setDirty
}

您的按钮：

<a href="/#/setup" class="button round" ng-disabled="myForm.$pristine" ng-click="completeStep()">Continue</a>