Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

144
Visualizações
How to display only range of days in mat-calendar without datePicker?

How can I show an array of days in mat-calendar, like for example I have the following arrangement:

Array: ['MO', 'TH', 'FR']  

And I want that when starting the mat-calender component, only and only the days that the arrangement is enabled (['MO', 'TH', 'FR'])

Currently, I have something like this:

dayAvaibality!: any;

ngOnInit(){
 this.dayAvaibality = this.getAvaibility();
}

    getAvaibility(){
      let workingDays: string[] = [];
      //If the user selected a place show me the calendar you have for that place
      if(this.selectedPlace && this.selectedPlace.schedules){
      //So it loops through the array once for each element of the array
      this.selectedPlace.schedules.forEach((schedule: { days: any[]; }, index: any) => {
        // And return the iteration of the array traversal and store it in the new element 
        // obtained
          // in workingDays
        Object.keys(DaysOfWeek).forEach((key, index) => {
          if (schedule.days.some((day: string) => day == key)) {
            workingDays.some(alreadyAddedDay => alreadyAddedDay == key) ? null : workingDays.push(key)
          }
        })
      })
      console.log('Days working', workingDays);
     return workingDays;
    }
    else{
      return console.error('Ha ocurrido un error');
    }
}

 dateFilter = (date: Date) => {
    return this.dayAvaibality?.includes(moment(date).format('dd'));
  }

enum DaysOfWeek {
  "MO" = 1,
  "TU" = 2,
  "WE" = 3,
  "TH" = 4,
  "FR" = 5,
  "SA" = 6,
  "SU" = 7,
}

html: //NgIF that loads until it has read dayAvaibality

<mat-calendar [dateFilter]="dateFilter" *ngIf="dayAvaibality"></mat-calendar>

What it currently shows me:

enter image description here

How to display only range of days in mat-calendarwith momentJS? Pleaseee Help Me, I am desperate, I have tried several things, I can not find a single example, it helps. I am new programming

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda