我可以重构 Angular JS 验证条件以简化代码吗？

Question

下面的代码是我表单的一行。

我在整个 sn-p 中多次复制“AddCarForm.uCarName.$dirty && AddCarForm.uCarName.$invalid”。我可以将其重构为一个变量，随着用户输入的变化/更好的重构方式，该变量将根据条件的答案进行更新？

<div class="form-group required " ng-class="{'has-error': AddCarForm.uCarName.$dirty && AddCarForm.uCarName.$invalid}">
  <label class=" control-label col-lg-5 " for="uCarName">Name:</label>
  <div class="col-lg-7 ">
    <input type="text" ng-model="carDetails.carName" name="uCarName" class="form-control" required />
  </div>
  <div class="row">
    <div ng-show="AddCarForm.uCarName.$dirty && AddCarForm.uCarName.$invalid" class="error-msg col-lg-offset-5 col-lg-7">
      <span ng-show="AddCarForm.uCarName.$error.required"> Car Name required </span>	
    </div>
  </div>
</div>

Answer 1

在您的控制器上，让该表达式从函数返回，即：

$scope.shouldShow = function() {
      return $scope.AddCarForm.uCarName.$dirty && $scope.AddCarForm.uCarName.$invalid;
}

然后做：

ng-show="shouldShow();"

只需要确保表单确实在范围内。