从日期到 angular js 中的日期验证

Question

这是我的代码

<tr ng-show="option == 'Yearly' || option == 'Date'">
  <td>
    <label>From:</label>
  </td>
  <td>
    <input type="date" ng-model="fromdate" id="fromdate" date-picker />
  </td>
  <td>
    <label>To:</label>
  </td>
  <td>
    <input type="date" ng-model="todate" date-picker />
  </td>
</tr>

我有一个 jquery 日期选择器 for fromdate 和 todate，我需要禁用结束日期中小于开始日期的所有日期.....

Answer 1

如果您只想设置一个特定的最小日期，例如今天的日期，您可以将其作为设置放入。

https://docs.angularjs.org/api/ng/input/input%5Bdate%5D

如果您有一种简单的方法可以将最晚日期设置为今天，您可以只使用这样的变量 min="{{minDate | date:'yyyy-MM-dd'}}")。请注意，min 还将添加本机 HTML5 约束验证。

从理论上讲，这不需要控制器，只需要 $scope.minDate 的应用程序设置配置，所有要做的就是注意，无论您进行何种验证，该字段旁边的日期都不正确已设置，字段和表单验证与您所要求的完全不同，但我会阅读 https://docs.angularjs.org/guide/forms。

在较长的运行中，我不会使用 jquery 日期选择器并使用像 https://angular-ui.github.io/bootstrap/ Date picker or Angular Material https://material.angularjs.org/latest/demo/datepicker

这样的本机指令

Answer 2

我用过https://github.com/Eonasdan/bootstrap-datetimepicker 如果您想查看另一个插件，以前和 minDate and maxDate 选项可能对您的用例有帮助。

示例用法设置 maxDate、minDate:

html:

<div class="container">
    <div class="row">
        <div class='col-sm-6'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker1'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
    </div>
</div>

js:

$('#datetimepicker1').datetimepicker({
  maxDate: new Date("6/8/2016"),
  minDate: new Date("6/2/2016")
});

工作Plunker

注意：此插件依赖于 bootstrap、jquery 和 momentjs

编辑：

这里还有一个 angular 包装指令：https://github.com/diosney/angular-bootstrap-datetimepicker-directive

从日期到 angular js 中的日期验证

From date , To date validation in angular js

html

javascript

jquery

frontend

angularjs