AngularJS Material Datepicker 更改格式

Posted

技术标签:

【中文标题】AngularJS Material Datepicker 更改格式【英文标题】:AngularJS Material Datepicker change format 【发布时间】:2018-10-28 04:07:45 【问题描述】:

我正在为一个项目使用 AngularJS Datepicker。发布日期时,我成功取回了数据,但问题是我得到的日期格式为 2018-05-23T06:00:00.000Z。

有没有办法让它只显示 2018-05-23?

这就是我当前的日期选择器

  // Date picker


  $scope.myDate = new Date();

  $scope.minDate = new Date(
    $scope.myDate.getFullYear(),
    $scope.myDate.getMonth() - 2,
    $scope.myDate.getDate());

  $scope.maxDate = new Date(
    $scope.myDate.getFullYear(),
    $scope.myDate.getMonth() + 2,
    $scope.myDate.getDate());

  $scope.onlyWeekdaysPredicate = function (date) 
  var day = date.getDay();
  return day === 1 || day === 2 || day === 3 || day === 4 || day === 5;
  ;

这是我的 html

<md-input-container style="margin:0px;position:relative;right:15px;font-size:15px">
   <md-datepicker ng-model="user.next_class" ng-model="myDate" md-placeholder="Pick a date" md-date-filter="onlyWeekdaysPredicate" date:"MM/dd/yyyy 'at' h:mma" md-open-on-focus></md-datepicker>
</md-input-container>

我听说过为此使用 Moment.JS,目前正在尝试寻找可能有帮助的资源。

【问题讨论】:

【参考方案1】:

您可以将日期转换为toISOString(),然后将日期部分切掉

var date1 = "2018-05-23T06:00:00.000Z";

var d = new Date(date1).toISOString().slice(0, 10);

console.log(d)

【讨论】:

【参考方案2】:

是的, momentJs 提供了广泛的格式化选项,您可以使用 momentJS 库方便的各种功能。请检查以下格式以转换为您需要的任何 dateFormat。

`var myDate = 2018-05-23T06:00:00.000Z; // 这是你的 datepicker ng-model 变量 var customDate = moment(myDate).format("YYYY-MM-DD");

【讨论】:

以上是关于AngularJS Material Datepicker 更改格式的主要内容,如果未能解决你的问题,请参考以下文章

angularjs material 实现搜索框

更改 AngularJS Material 图标的图标大小

fieldset 在 angularjs-material 中破坏了我的 flex 布局

AngularJS Material Datepicker 更改格式

AngularJS Material Design 没有 Animations 支持,如何实现?

在 AngularJS Material 底页中使用输入