изначально показывать заполнитель на md-datepicker - PullRequest
Новая
       27

изначально показывать заполнитель на md-datepicker

0 голосов
/ 31 октября 2018

Мне нужно показать только текст заполнителя в 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>

Показывает текущую дату. Мне нужно получить чистое поле, и оно должно показывать текст заполнителя.

screen shot example

Ответы [ 2 ]

0 голосов
/ 31 октября 2018 
<md-datepicker
  name="terminationDate"
  md-placeholder="Enter date"
  ng-model="vm.terminationDate">
</md-datepicker>

Пожалуйста, обратитесь это: http://plnkr.co/edit/O5ePYKyo1ILlheMz8KdO?p=preview Это может помочь вам.

0 голосов
/ 31 октября 2018

Вам нужно удалить функцию 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>
...