Get "Day" of Selected Date in ngb-datepicker (ng Bootstrap) in Angular Application

Question

Demo: https://stackblitz.com/edit/angular-bife8z-px13fl?file=app%2Fdatepicker-basic.html

I have added Day(Sunday) as static text, i want this to be changed according to date selection form calendar.

Answer 1

You can use the calendar to get the day of the week and have a Dictionary which stores the Day names.

weekDays = {
  1: 'Monday',
  2: 'Tuesday',
  3: 'Wednesday',
  4: 'Thursday',
  5: 'Friday',
  6: 'Satarday',
  7: 'Sunday'
}

Selected Date is: <b>{{weekDays[calendar.getWeekday(model)]}}

https://stackblitz.com/edit/angular-bife8z-bftzuu?file=app%2Fdatepicker-basic.html

Infact you can have a variable for day which gets set in the setter of the model variable.

  selectedDay: string = '';
  set model(val) {
    this._model = val;
    this.selectedDay = this.weekDays[this.calendar.getWeekday(this.model)]
  }

  get model() {
    return this._model;
  }

 Selected Date is: <b>{{selectedDay}}</b> <br>