ng2-bootstrap DatePickerのcustomClassプロパティを使用するにはどうすればよいですか？

Question

ng2-bootstrap DatePickerを使用して複数の日付を選択できるようにしています。ピッカーの「選択された」日付を強調したいと思います。 "customClass"プロパティはこれを行う方法でなければならないようですが、私はそれを動作させることができませんでした。また、その使用例を見たこともありませんでした。誰でも簡単な例がありますか？

Answer 1

同じ問題に遭遇し、Githubのコードを掘り下げなければならなかった。私の例では、開始日と終了日があり、その間にすべての日をスタイルする必要があります。

私はMoment.jsを使用しています.Moment.jsは、多くのロジックを処理して日の配列を生成しています。 DateRangeUtilsはカスタムヘルパークラスです。

重要なことは、モードが日付ピッカー（日、月、年）のモードであることです。私の例では、曜日モードのみを使用しています。

export class CustomDayStyle { 
 
    public date: Date; 
 
    public mode: string; 
 
    public clazz: string; 
 

 
    constructor(date: Date, mode: string, clazz: string) { 
 
     this.date = date; 
 
     this.mode = mode; 
 
     this.clazz = clazz; 
 
    } 
 
} 
 

 
private get selectedDays(): Array<CustomDayStyle> { 
 
    var days = new Array<CustomDayStyle>(); 
 

 
    var dateIndex = DateRangeUtils.toMoment(this.beginDate); 
 
    while (!DateRangeUtils.isAfter(dateIndex, this.endDate)) { 
 
    days.push(new CustomDayStyle(dateIndex.clone().toDate(), "day", "class-name-here")); 
 
    dateIndex.add(1, 'days'); 
 
    } 
 

 
    return days; 
 
}

.class-name-here { 
 
    // Your css here 
 
}

<datepicker [(ngModel)]="beginDate" [customClass]="selectedDays" > 
 
</datepicker>