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

Question

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

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

appCtrl.myDate = null;

这是我的 html 代码。

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

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

Answer 1

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

这是片段：

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>

Answer 2

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

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

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

initially show place holder on md-datepicker

html

javascript

datepicker

angularjs

angularjs-material