Как передать массив динамически в переменную в angular

Question

https://github.com/hsuanxyz/ion2-calendar/issues/241

Здесь это записано как

. Вы можете изменить цвет даты по умолчанию, передавая дни в daysConfig и передавая dayConfig: {отмечено: true } и затем вы можете изменить цвет с .marked class css, а также вы можете передать с помощью клавиши 'cssClass'

daysConfig.push({
date: new Date(item),
marked: true
});

DayConfig {
date: Date;
marked?: boolean;
disable?: boolean;
title?: string;
subTitle?: string;
cssClass?: string;
}

вот интерфейс daysConfig

Когда я попробовал как это

 options: CalendarComponentOptions = {
    from: new Date(2000, 0, 1),
    pickMode: 'multi',

    daysConfig: [
      {
        date:new Date(this.absentdate[0]),
        marked:true,
        cssClass: 'my-cal'
      },
      {
        date:new Date(this.absentdate[1]),
        cssClass:'my-cal',
       marked:true
      },
      {
        date:new Date(this.absentdate[2]),
       cssClass:'my-cal',
        marked:true
      }
    ],

  };

это сработало

Но у меня есть массив absent_date как

 absentdate :string[]=['2020-01-03', '2020-01-04', '2020-01-28'];

, который меняется в зависимости от месяца. Как я могу изменить жестко закодированный значение для отсутствующих дат, которые я дал в массиве. Пожалуйста, помогите мне.

T Template ::

<ion-calendar [(ngModel)]="date"
                  (change)="onChange($event)"
                  [options]="options"
                  type="string"
                  format="YYYY-MM-DD"
                  readonly="true"

                  >
    </ion-calendar>

Answer 1

Инициализируйте следующий формат для опций

options: CalendarComponentOptions = {
    from: new Date(2000, 0, 1),
    pickMode: 'multi',
    daysConfig: []
};

Далее вы можете l oop через absentdate [] и pu sh каждый набор данных в опции, как показано ниже.

absentdate.forEach(element => {
    var data = {
        date:new Date(element), //can give custom data
        marked:true, //can give custom data
        cssClass: 'my-cal' //can give custom data
    }
    options.daysConfig.push(data)
})

Примечание. Это может иногда сортировать данные. если вы не хотите сортировки, вы можете использовать приведенную ниже строку вместо pu sh. Он будет вставлять данные в конец массива каждую итерацию

options.daysConfig.splice(options.daysConfig.length, 0, data)

Это должно обеспечить следующий вывод. Дайте мне знать, если это было то, что вы искали:)

{ from: 1999-12-31T18:30:00.000Z,
  pickMode: 'multi',
  daysConfig:[ 
      { 
          date: 2020-01-03T00:00:00.000Z,
          marked: true,
          cssClass: 'my-cal' 
      },
      { 
          date: 2020-01-04T00:00:00.000Z,
          marked: true,
          cssClass: 'my-cal' 
      },
      { 
          date: 2020-01-28T00:00:00.000Z,
          marked: true,
          cssClass: 'my-cal' 
      } 
  ] 
}