web-dev-qa-db-ja.com

Material datePickerで複数の日付を選択（角度）

ユーザーが日付ピッカーで複数の日付を選択できるという要件があります。 Angular Material date pickerに複数の日付選択機能を実装するにはどうすればよいですか？

date picker

dateClassでこれを試しました。ただし、すべての日付選択の後、日付ピッカーは閉じられます。

これが私が試したものです

HTMLコード：

<input matInput [matDatepicker]="picker" placeholder="Choose a date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker [dateClass]="dateClass" #picker></mat-datepicker>

TypeScriptコード：

dateClass = (d: Date) => {
    const date = d.getDate();

    // Highlight the 1st and 20th day of each month.
    return (date === 1 || date === 5 || date === 14 || date === 19 || date === 21 ) ? 'example-custom-date-class' : undefined;
}
angulardatepickerangular-materialangular-material-datetimepickermat-datepicker
4
Vinoth A

もう1つの方法（ちょっとしたハック）： StackBlitz

Closeメソッドを空の関数に一時的に書き換え、変更後にそれを返すだけです。また、平日の再レンダリング機能を呼び出します。安全で理想的なソリューションではありませんが、機能します。

誰かに役立つかもしれません。

0
Ruslan Lekhman