Angular MaterialでDatepickerコンポーネントを使用しようとしています。これが私のHTMLコードです。
<input matInput [matDatepicker]="picker" placeholder="Choose a date" disabled>
<mat-datepicker #picker disabled="false"></mat-datepicker>
しかし、それは私のために機能しておらず、次のエラーが発生しています:
エラー:MatDatepicker:DateAdapterのプロバイダーが見つかりません。
エラーメッセージは、MatDatepickerModuleと同様にMatNativeDateModuleをインポートする必要があることを教えてくれますが、私はそれをしました。以下にapp.module.tsからのインポートコードを示します。
import {
MatFormFieldModule,
MatMenuModule,
MatCheckboxModule,
MatIconModule,
MatDatepickerModule,
MatNativeDateModule
} from '@angular/material';
私が不足しているものは他にありますか?
MatDatepickerModule
とMatNativeDateModule
の両方をインポートし、プロバイダーの下にMatDatepickerModule
を追加する必要があります
imports: [
MatDatepickerModule,
MatNativeDateModule
],
providers: [
MatDatepickerModule,
],
ただインポートする
MatNativeDateModule
一緒に
MatDatepickerModule
app.module.tsまたはapp-routing.module.tsで。
@NgModule({
imports: [
MatDatepickerModule,
MatNativeDateModule
]
})
公式ドキュメント: エラー:MatDatepicker:DateAdapter/MAT_DATE_FORMATSのプロバイダーが見つかりません
日付ピッカーは、日付実装に依存しないように構築されました。これは、さまざまな異なる日付の実装で動作するようにできることを意味します。ただし、開発者は、選択した実装で動作するために、datepickerに適切なピースを提供することを確認する必要があることも意味します。これを確実にする最も簡単な方法は、既成モジュールの1つであるMatNativeDateModule、MatMomentDateModuleをインポートすることです。
修正:
@NgModule({
imports: [MatDatepickerModule, MatNativeDateModule],
})
export class MyApp {}