1

I have a ion-slider that shows the days of a week in array, and i need to pass the index of the day is today. I have a global variable called compareFirstDay that shows the day is today and the array of objects with the days of the week called this.showingWeekCalendar, so when the screen size is minor or equal to 768px i need to pass the index position of the day is today to show this day first of all in slide.

this.showingWeekCalendar

0: {name: "Sunday", agenda: Array(0), date: "03/02/2019"}
1: {name: "Monday", agenda: Array(0), date: "04/02/2019"}
2: {name: "Tuesday", agenda: Array(0), date: "05/02/2019"}
3: {name: "Wednesdey", agenda: Array(0), date: ""}
4: {name: "Thursday", agenda: Array(0), date: ""}
5: {name: "Friday", agenda: Array(0), date: ""}
6: {name: "Saturday", agenda: Array(0), date: ""}

home.ts

//iterate the array of the week
       for (let i = 0; i < 7; i++) {  
          //compare date of today with the days of the week to find the right day
          if (compareFirstDay === this.showingWeekCalendar[i].date) {               

                if (screenSize <= 768) {
                 //how can i pass the parameter to the method to show the position of the day
                  this.showingWeekCalendar[i].getActiveIndex();
                }
          }     
        }

HTML

<ion-slides pager="false" [options]="slideOpts" (ionSlidesDidLoad)="ionSlidesLoaded()">
          <ion-slide class="day-calendar" *ngFor="let weekAgenda of showingWeekCalendar">
            <p class="text-center slides-control m-t-10">
              <ion-button shape="round" fill="clear" (click)="slideBack()" *ngIf="slidesdidLoad"><i class="mdi mdi-chevron-left"></i></ion-button>
              {{weekAgenda.name}}<br>
              {{weekAgenda.date}}
              <ion-button shape="round" fill="clear" (click)="slideForward()" *ngIf="slidesdidLoad"><i class="mdi mdi-chevron-right"></i></ion-button>
            </p>
            <mwl-calendar-day-view [hourSegments]="4" [locale]="locale" [viewDate]="viewDate" [events]="weekAgenda.agenda"
              [refresh]="refresh" [eventWidth]="180" (eventClicked)="handleEvent($event.event)" (eventTimesChanged)="eventTimesDayChanged($event)"
              (hourSegmentClicked)="hourSegmentClicked($event.date, weekAgenda)" [dayStartHour]="weekViewWorkingHours.start" [dayEndHour]="weekViewWorkingHours.end">
            </mwl-calendar-day-view>
          </ion-slide>
        </ion-slides>

If need more information please let me know in the comments. thank you

Matheus Barem
  • 1,497
  • 2
  • 20
  • 37

0 Answers0