如何以角度验证日期格式答案

【问题标题】：how to validate date format in angular如何以角度验证日期格式
【发布时间】：2015-05-13 15:16:25
【问题描述】：

您好，我只是想知道问题，例如，如果我有角度 UI 日期 piker 日期格式 yyyy-MM-dd 。如果用户通过键入输入日期并且他们输入错误的格式，例如 yyyy-dd-mm 应用程序认为它是有效日期并将其保存为 YYYY-MM-dd。我该如何验证格式是否正确？

<div class="panel panel-default">
    <div class="panel-heading">Date </div>
    <div class="panel-body">
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label class="control-label"><i class="fa fa-calendar"></i><i class="icon-required"></i>Date [YYYY-MM-DD]</label>
                    <div class="input-group">
                        <input type="text" class="form-control" datepicker-popup="yyyy-MM-dd" data-ng-model="model.date" is-open="isDatePickerOpen" close-text="Close" />
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-default" data-ng-click="openDatePicker($event)"><i class="glyphicon glyphicon-calendar"></i></button>
                        </span>
                    </div>
                    <div class="validation-warning" data-ng-show="displayModel.showDateValidator"><i class="icon-alert"></i>Required</div>
                </div>
            </div>
        </div>
    </div>
</div>

验证器

var formValidator = function ($scope) {
    var isDateValid = function () {
        return $scope.model != null && $scope.model.date != null && $scope.model.date !== '';
    };

    return {
        valid: function () {
            var isValid = true;
            if (!isDateValid()) {
                isValid = false;
            }

            return isValid;
        },
        addWatches: function () {
            $scope.$watch('model.date', function () {
                $scope.displayModel.showDateValidator = !isDateValid();
            });

        }
    };

};//ActivitiesFormValidator

【问题讨论】：

标签： javascript angularjs validation date datetime

【解决方案1】：

Momentjs 库可能对你有用。

moment("2010 13",           "YYYY MM").isValid();     // false (not a real month)
moment("2010 11 31",        "YYYY MM DD").isValid();  // false (not a real day)
moment("2010 2 29",         "YYYY MM DD").isValid();  // false (not a leap year)
moment("2010 notamonth 29", "YYYY MMM DD").isValid(); // false (not a real month name)

【讨论】：

【解决方案2】：

使用原生静态Date.parse() 方法或查看momentjs 库，它对它有很好的日期抽象。

您也可以使用正则表达式来检查您的日期，例如

/\d{4}-\d{2}-\d{2}/.test($scope.model.date)

但它应该与 Date.parse 成对出现，因为 9999-99-99 将通过这样简单的验证器。

无论如何，这里有一些 regexps 用于日期验证。

【讨论】：

"在 ES5 之前不建议使用 Date.parse，字符串的解析完全依赖于实现" - developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
@java-addict301 来吧，你要离开哪一年？已经有es2019了
嘿，我只是个信使 - 如果您不同意，请与 Mozilla 联系。它指出“不同主机解析日期字符串的方式仍然存在许多差异，因此应该手动解析日期字符串（如果要适应许多不同的格式，库可以提供帮助）。”

【解决方案3】：

我将您的 FormValidator 函数更新为使用原生 JavaScript

var formValidator = function ($scope) {
    var isDateValid = function () {
        //return $scope.model != null && $scope.model.date != null && $scope.model.date !== '';
        var dateTime = $scope.model.date;
        if (dateTime === null) return false;
        var day = dateTime.getDate();
        var month = dateTime.getMonth() + 1;
        var year = dateTime.getFullYear();
        var composedDate = new Date(year, month, day);
        return composedDate.getDate() === day &&
                 composedDate.getMonth() === month &&
                 composedDate.getFullYear() === year;

    };

    return {
        valid: function () {
            var isValid = true;
            if (!isDateValid()) {
                isValid = false;
            }

            return isValid;
        },
        addWatches: function () {
            $scope.$watch('model.date', function () {
                $scope.displayModel.showDateValidator = !isDateValid();
            });

        }
    };

};//ActivitiesFormValidator

【讨论】：