Ngb Date Picker minDate и maxDate не работают должным образом

Я использовал ngbDatePicker для выбора нескольких дат.

Я хочу отключить дату до текущей даты.

Но когда я использую директиву minDate, был отключен только последний месяц, а не даты до сегодняшнего дня.

Шаблон:

<ngb-datepicker #dp   [minDate]="minDate" [maxDate]="maxDate" [displayMonths]="2" [dayTemplate]="t">
</ngb-datepicker>

<ng-template #t let-date="date" let-focused="focused">
  <span class="custom-day" (click)="onDateSelection($event,date)"
        [class.focused]="focused"
        [class.range]="isFrom(date) || isTo(date) || isInside(date) || isHovered(date)"
        [class.faded]="isHovered(date) || isInside(date)"
        [class.selected]="isDateSelected(date)"
        (mouseenter)="hoveredDate = date"
        (mouseleave)="hoveredDate = null">
    {{ date.day }}
  </span>
</ng-template>

У меня есть пример stack-blitz


angular ngb-datepicker
person NicoleZ    schedule 12.09.2019    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Если вы не хотите удалять этот настраиваемый шаблон даты, вам необходимо обработать атрибут disabled в шаблоне.

Вот обновленный Stackblitz с dayTemplate

person Dima Mamchur    schedule 12.09.2019
comment
.это работает нормально, есть ли способ изменить. этот цвет недоступных данных в средстве выбора даты - person NicoleZ; 12.09.2019
comment
да. Вы можете изменить стили на все, что захотите. Например, я заменил класс для отключенных элементов на свой собственный, выполнив [class.day-disabled]="disabled", и добавил соответствующие изменения в определения styles в компоненте. Посмотрите на stackblitz выше - я его обновил. - person Dima Mamchur; 12.09.2019

arrow_upward
1
arrow_downward

Удалить [dayTemplate]="t"

Попробуйте вот так:

<ngb-datepicker #dp   [minDate]="minDate" [maxDate]="maxDate" [displayMonths]="2" >
</ngb-datepicker>

См. Обновленную рабочую демонстрацию Stackbiltz

person Adrita Sharma    schedule 12.09.2019
comment
если я удалю это. Я больше не могу выбрать несколько дат - person NicoleZ; 12.09.2019