使用angularJS设置HTML5日期输入字段的默认值

Set default value of HTML5 date input field with angularJS

本文关键字：字段 默认值 输入 日期 angularJS 设置 HTML5 使用      更新时间：2023-12-01

我希望将我在moment中生成的默认值绑定到日期和时间输入字段。我尝试了ng模型，并将其直接绑定到值属性。但这些似乎都不起作用。有办法让它发挥作用吗？

编辑：此外，如何绑定时间输入字段？

<body ng-app="myApp">
<div ng-controller="MyCtrl">
    <input type="date" ng-model="date" value="{{date}}">
        <p>{{date}}</p>
    <input type="time" ng-model="time" value="{{time}}">    
</div>

这是一把小提琴：http://jsfiddle.net/chrisyeung/bF9Pq/

如果使用chrome，则必须将日期格式指定为"yyyy-MM-dd"。

$scope.date = $filter("date")(Date.now(), 'yyyy-MM-dd');

否则根本不起作用。这是一个工作版本http://jsfiddle.net/bF9Pq/4/

工作小提琴

{{date | date:'MM/dd/yyyy'}}

我将其更改为日期并添加日期过滤器。

value="{{date}}"

导致初始化错误：指定的值"｛｛datum_default｝｝"不符合所需的格式"yyyy-MM-dd"。

解决方案：不要在模板中设置日期！

<input type="date" ng-model="date_code">

在控制器中指定日期！

$scope.date_code = new Date();

您也可以执行以下操作：

$scope.date = new Date().toLocaleDateString('en-CA');

使用矩库，您可以使用以下内容：

$scope.date = new Date()

如果该值已存储在数据库/变量中：

$scope.date = new Date(moment(varName).tz('Asia/Kolkata').format('L'))
moment.locale();         // en
moment().format('LT');   // 9:58 AM
moment().format('LTS');  // 9:58:18 AM
moment().format('L');    // 12/07/2020
moment().format('l');    // 12/7/2020
moment().format('LL');   // December 7, 2020
moment().format('ll');   // Dec 7, 2020
moment().format('LLL');  // December 7, 2020 9:58 AM
moment().format('lll');  // Dec 7, 2020 9:58 AM
moment().format('LLLL'); // Monday, December 7, 2020 9:58 AM
moment().format('llll'); // Mon, Dec 7, 2020 9:58 AM
相关文章：