Datepicker - только год - PullRequest
       95

Datepicker - только год

1 голос
/ 10 октября 2019

Я изменяю простой указатель даты.

Я хотел бы иметь только выпадающий список Год (Месяц не требуется).

enter image description here

Я попытался удалить раскрывающийся список Месяц, добавив css:

select.custom-select {
    display: none;
}

К сожалению, это не только удаляет раскрывающийся список Месяц, но и Год, см. Ниже: enter image description here

См. STACKBLITZ

Ответы [ 4 ]

2 голосов
/ 10 октября 2019

Вы можете использовать формат yyyy только на год. Попробуйте код ниже.

$scope.dateOptions = {
    formatYear: 'yyyy',
    startingDay: 1,
    minMode: 'year'
};

Рабочая демонстрация http://plnkr.co/edit/0SPMYQ6ND7AOfZwDAFB8?p=preview

2 голосов
/ 10 октября 2019

Лучше всего использовать Datepicker из ngx-bootstrap.

Проверить эту ссылку: https://valor -software.com / ngx-bootstrap / # / datepicker # min-mode

У него есть опция для режима отображения, называемого минимальным режимом, поэтому вы не можете выйти за пределы этого. Вы можете установить минимальный режим на «год» в вашем случае. Работает красиво!

2 голосов
/ 10 октября 2019

Вы можете добавить стиль к первому выбору

@Component({
  selector: 'ngbd-datepicker-basic',
  templateUrl: './datepicker-basic.html',
  styles:[':host ::ng-deep select:first-child{display:none;}']
})
export class NgbdDatepickerBasic {
...
}

Ссылка: https://stackblitz.com/edit/angular-year-datepicker-ng-bootstrap-kyjfjz

1 голос
/ 10 октября 2019

Простым решением будет использование css, чтобы скрыть первый элемент select внутри ngb-datepicker-navigation-select, используя display:none

Рабочий пример: https://stackblitz.com/edit/angular-year-datepicker-ng-bootstrap-8ag1xe

...