Question

我的表单中有2个文本字段。 1表示出生日期。另一个是有人希望退休的时候。

出生日期可以是过去100年的任何时间。

退休年龄必须介于出生日期和今天之间。

这意味着如果出生日期改变退休年龄字段必须更改其最小和最大验证属性。

这目前工作正常，但有一种情况是它无法正常工作。它可以通过以下方式复制：

输入出生日期。角度改变退休年龄的最大值并正确验证年龄输入。修改出生日期。我需要退休年龄字段重新验证，因为虽然最小值/最大值已经改变，但角度仍然认为它有效。

希望这是有道理的。

<input type="text" id="id_dob" class="form-control" name="dateOfBirth" data-ng-model="user.dateOfBirth" date-of-birth placeholder="dd/mm/yyyy" required />
<input type="text" id="id_intendRetireInput" class="form-control" name="retirementAge" data-ng-model="user.retirementAge" integer required app-min="{{retirementmin}}" app-max="{{retirementmax}}" />

app.js

calculonApp.directive('dateOfBirth', function() {
  return {
    require: 'ngModel',
    link: function(scope, elm, attrs, ctrl) {
      ctrl.$parsers.unshift(function(viewValue) {
        if (moment(viewValue, "DD/MM/YYYY") < scope.min || moment(viewValue, "DD/MM/YYYY") > scope.max) {
          ctrl.$setValidity('dateOfBirth', false);
          return undefined;
        } else {
          ctrl.$setValidity('dateOfBirth', true);
          scope.retirementmin = moment().diff(moment(viewValue, "DD/MM/YYYY"), 'y');
          return viewValue;
        }
      });
    }
  };
});

 calculonApp.directive('appMin', function () {
  return {
    require: 'ngModel',
    link: function (scope, elem, attrs, ctrl) {
      return ctrl.$parsers.push(function (value) {
        var valid = value == null || Number(value) >= Number(attrs.appMin);

        ctrl.$setValidity('min', valid);

        return valid ? value : undefined;
      });
    }
  };
});

calculonApp.directive('appMax', function () {
  return {
    require: 'ngModel',
    link: function (scope, elem, attrs, ctrl) {
      return ctrl.$parsers.push(function (value) {
        var valid = value == null || Number(value) <= Number(attrs.appMax);

        ctrl.$setValidity('max', valid);

        return valid ? value : undefined;
      });
    }
  };
});

angularjs表单验证 - 2个字段可能会更改

0 个答案: