最初在 md-datepicker 上显示占位符答案

【问题标题】：initially show place holder on md-datepicker最初在 md-datepicker 上显示占位符
【发布时间】：2019-04-04 04:50:00
【问题描述】：

在选择日期之前，我只需要在 md-datepicker 上显示占位符文本。但是当我向 md-datepickeer 发送一个空值时，它默认显示当前日期。

这是我传递空日期的 angularjs 控制器代码行

appCtrl.myDate = null;

这是我的 html 代码。

 <md-datepicker-custom name="dateField" 
                     ng-model="appCtrl.myDate" 
                     md-placeholder="Enter time" >
                     </md-datepicker-custom>

它显示当前日期。我需要清除字段，它应该显示占位符文本。

【问题讨论】：

标签： javascript html angularjs datepicker angularjs-material

【解决方案1】：

您需要从配置中删除 formatDate 函数，然后占位符才起作用。

这里是sn-p：

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

app.config(function($mdDateLocaleProvider) {
  $mdDateLocaleProvider.formatDate = formatDate;

  function formatDate(date) {
    return date ? moment(date).format('L') : '';
  }
});

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

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.8/angular-material.min.css">
</head>

<body>

  <md-datepicker name="terminationDate" md-placeholder="Enter date" ng-model="vm.terminationDate">
  </md-datepicker>


  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-aria.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-messages.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment-with-locales.min.js"></script>

  <!-- Angular Material Library -->
  <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.js"></script>
</body>

</html>

【讨论】：

【解决方案2】：

<md-datepicker
  name="terminationDate"
  md-placeholder="Enter date"
  ng-model="vm.terminationDate">
</md-datepicker>

请参考：http://plnkr.co/edit/O5ePYKyo1ILlheMz8KdO?p=preview 它可能会帮助你。

【讨论】：