1

I'm working on an Angular 4 application where I use ngbDatePicker. Following the DatePicker HTML.

<div class="datepicker mgn-btm-twnty wdth100percent" (document:click)="closePicker(dateControl)" (click)="$event.stopPropagation()">
    <label class="mgn-btm-ten required_start startdate">Date<i class="fa fa-asterisk" aria-hidden="true"></i></label>
    <div class="form-inline">
        <div class="form-group">
            <div class="input-group">
                <input class="form-control" placeholder="dd-mmm-yyyy" name="date" [(ngModel)]="date"
                    firstDayOfWeek="1" ngbDatepicker #dateControl="ngbDatepicker" required="false" (navigate)="date = $event.next">
                <div class="input-group-addon" (click)=dateControl.toggle()>
                    <i class="material-icons">date_range</i>
                </div>
                <label class="animate-border"></label>
            </div>
        </div>
    </div>
</div>

Our requirement is to highlight current date by default when the datepicker popup opening up.

Please share me if you have any solution for this.

David R
  • 14,711
  • 7
  • 54
  • 72
Balamurugan Ranganathan
  • 11
  • 1
  • 4

2 Answers2

3

As of ~v4.1.0 link to github commit they now add the class ngb-dp-today to div that holds the date.

There is nothing in the default CSS, referring to it, but you can add custom CSS.

.ngb-dp-today {
    background: yellow;
}
CodeMonkey
  • 3,271
  • 25
  • 50
0

Please check whether this Helps. https://ng-bootstrap.github.io/#/components/datepicker/examples

You can set the Today Date to the ngModel variable, which will make the current date selected.

Suresh Kumar Ariya
  • 9,516
  • 1
  • 18
  • 27