在angularJS输入中将最小日期设置为当前日期

In AngularJS, how can we set the min attribute of input type="date" to current date (today's) ?

在AngularJS中，我们如何将input type =“date”的min属性设置为当前日期（今天）？

<input type="date" ng-model="data.StartDate" name="StartDate" min=?? />

Edit1

EDIT1

I did what was suggested below and added this in controller -

我做了下面的建议并在控制器中添加了这个 -

$scope.currentDate = new Date();

And this in Html -

这在Html中 -

<input type="date" ng-model="data.StartDate" name="StartDate" required min="{{currentDate | date:'yyyy-MM-dd'}}" />
<span ng-show="form.StartDate.$dirty && form.StartDate.$invalid">
    <span ng-show="form.StartDate.$error.required">Start Date is required</span>
    <span ng-show="form.StartDate.$error.min">Start Date should not be less than current date</span>
</span>

Now, only the year is not allowing to be selected less than 2015. Also, if whole date is less than current date, then no validation is occuring. Required validation is working fine. Is .min correct way to check the field?

现在，只有年份不允许选择少于2015年。此外，如果整个日期小于当前日期，则不会进行验证。所需的验证工作正常。是.min正确检查现场的方法吗？

Thanks

谢谢

5 个解决方案

#1

Yes you can set a minimum value. According to docs:

是的，您可以设置最小值。根据文件：

<input type="date"
       ng-model=""
       [name=""]
       [min=""]
       [max=""]
       [required=""]
       [ng-required=""]
       [ng-change=""]>

Arguments

参数

min (optional) string - Sets the min validation error key if the value entered is less than min. This must be a valid ISO date string (yyyy-MM-dd).

min（可选）string - 如果输入的值小于min，则设置min验证错误密钥。这必须是有效的ISO日期字符串（yyyy-MM-dd）。

EDIT To set the field to current date:

编辑要将字段设置为当前日期：

controller:

控制器：

function Ctrl($scope)
{
    $scope.date = new Date();
}

view:

视图：

<input type="date" ng-model="data.StartDate" 
        name="StartDate" min="{{date | date:'yyyy-MM-dd'}}" />

Working example here.

这里的工作示例。

#2

According to the Angular docs

根据Angular文档

min (optional) string Sets the min validation error key if the value entered is less than min. This must be a valid ISO date string (yyyy-MM-dd).

min（可选）string如果输入的值小于min，则设置min验证错误键。这必须是有效的ISO日期字符串（yyyy-MM-dd）。

you can bind that to a scope variable or directly put the expression in the attribute, it just needs to be in the correct format (javascript date object has a toISOString() method). It should also be noted this does not prevent the user from picking a date below the minimum and instead sets the validation key to indicate the field is not valid.

你可以将它绑定到范围变量或直接将表达式放在属性中，它只需要采用正确的格式（javascript日期对象有一个toISOString（）方法）。还应注意，这不会阻止用户选择低于最小值的日期，而是设置验证密钥以指示该字段无效。

edit:

编辑：

Script

脚本

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
  var today=new Date();
  $scope.today = today.toISOString();
});

Html

HTML

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.14/angular.js" data-semver="1.3.14"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    <form name="myForm">
    <input type="date" ng-model="StartDate" name="StartDate" required min="{{today}}" />
    <span ng-show="myForm.StartDate.$dirty && myForm.StartDate.$invalid">
    <span ng-show="myForm.StartDate.$error.required">Start Date is required</span>
    <span ng-show="myForm.StartDate.$error.min">Start Date should not be less than current date</span>

</span>
</form>
  </body>

</html>

your error message indicates you want the date to be no greater than the current date, if that is the case simply change

您的错误消息表明您希望日期不大于当前日期，如果是这种情况只是更改

  <input type="date" ng-model="StartDate" name="StartDate" required min="{{today}}" />

至

  <input type="date" ng-model="StartDate" name="StartDate" required max="{{today}}" />

Working Example

工作实例

#3

just add in your controller

只需添加您的控制器

$scope.today=new Date() // calculates current date

and in your html code add -

并在您的HTML代码中添加 -

min-date="today"

#4

 var today = new Date().toISOString().split('T')[0];
        document.getElementsByName("appo_date")[0].setAttribute('min', today);

  <input type="date"  name="appo_date" id="appo_date" ng-model="appoint_data.appo_date"  
          ng-required="true" close-text="Close" uib-datepicker-popup="dd-MMMM-yyyy"  required>

#5

correct answers are already in above, if anyone looking for a solution in Angular 2/4/5 here is a way,

正确的答案已在上面，如果有人在Angular 2/4/5中寻找解决方案，这是一种方式，

in you .ts file

在.ts文件中

private todate = new Date();

in your html file,

在你的html文件中，

 <input type="date" min="{{todate | date:'yyyy-MM-dd'}}" class="form-control" [(ngModel)]="datemodel" id="input-12">

also here you can file other format options available in Angular

您也可以在此处提交Angular中提供的其他格式选项

date formats

日期格式

#1