Question

我正在学习角度，现在我创建了输入（类型：文本），它应该显示日期，它有ui.mask，如“99/99/9999”，它在模块中验证不通过（解锁按钮）有一个错误的日期，我的意思是例如00/00/0000或12/12/1700，但是输入不显示红框，它显示为有效格式，如何根据模块验证显示红框？

HTML
<input
    id="dob"
    type="text"
    class="form-control   cell-height  form-input"
    ng-model="createAccount.dob"
    ui-mask="99/99/9999"
    placeholder="D.O.B. (mm/dd/yyyy)"
    required/>

CONTROLLER
 var validateDob = function () {
        try {
            var date = moment.utc($scope.createAccount.dob, "MM/DD/YYYY");
            if ($scope.patient == null) $scope.patient = {};
            if (!date.utc().isValid()) return false;
            if (date.utc().date() == 0 || date.utc().year() == 0) return false;
            if (date.utc().isAfter(moment().utc())) return false;
            if (date.utc().isSame(moment().utc())) return false;
            if (!date.utc().isAfter(moment.utc().subtract(150, 'years'))) {
                return false;
            }
            $scope.createAccount.dateOfBirth = date.utc();//.format("YYYY/MM/DD");
            return true;

        }
        catch (err) {
            return false;
        }
    };

Answer 1

感谢angular documentation为了进行自定义验证，您需要创建一个指令，而不是控制器。

当验证器返回错误响应时，angular会将一个ng-invalid类放到DOM对象中。它将允许您更改边框颜色或无效输入的样式

Answer 2

有更简单的方法，ng-class - 检查validateDob是否返回false，如果是，则显示验证框架。

Angularjs iu.mask验证输入日期

2 个答案: