Как сделать тип ввода ВРЕМЯ 24-часовой формат? - PullRequest
Новая
       19

Как сделать тип ввода ВРЕМЯ 24-часовой формат?

0 голосов
/ 04 марта 2019

У меня есть проект Angular 7 с использованием Angular Material.Я также использовал тип времени в своем входном теге (HTML5) 

<input type="time">

, но я хочу, чтобы он был в 24-часовом формате (без отображения параметров AM / PM).Я искал решения, но ни один из них не подходит для проектов Angular Material.

1 Ответ

0 голосов
/ 04 марта 2019

Хотя средство выбора времени, которое я действительно ищу, точно такое же, как в HTML5, но без AM / PM, я использовал предложение @ MoshFeu, которое представляет собой Ngx Material Timepicker 

<mat-form-field>
  <input matInput class="timepicker" [ngxTimepicker]="pickerTwo" [format]=24 placeholder="End" [(ngModel)]="data.formData.end">
</mat-form-field>


<ngx-material-timepicker 
    #picker
    [enableKeyboardInput]=true>
</ngx-material-timepicker>

Popup Timepicker: Timeможет быть редактируемым со статическим двоеточием между ними (не просто выбирая числа в часах).Также имеет проверку для 24-часового формата и может нажимать клавиши вверх или вниз для увеличения и уменьшения.

enter image description here

Для CSS вы можете изменить цветаиспользуя :host /deep/ в классах

Пример: 

:host /deep/ .timepicker__header {
    background-color: #FF7043 !important;
}
...