javascript - MatDatepicker : No provider found for DateAdapter. 您必须在应用程序根目录中导入以下模块之一:MatNativeDateModule

Question

我已经在我的 app.module.ts 文件中导入了 matdatepicker，但它仍然显示一些错误。我无法让 Material 组件工作。该按钮工作正常并使用 Angular Material 组件。但是当我使用 datepicker 时它不起作用。

app.module.ts 文件

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import{ HttpClientModule} from '@angular/common/http';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {MatTableModule} from '@angular/material/table';
import {MatDatepickerModule} from '@angular/material/datepicker';
import {MatButtonModule} from '@angular/material/button';
import {MatFormFieldModule} from '@angular/material/form-field';


import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { InactiveusersComponent } from './component/inactiveusers/inactiveusers.component';
import { CalendarComponent } from './component/calendar/calendar.component';
import { InactiveItemComponent } from './component/inactive-item/inactive-item.component';
import { NewtableComponent } from './component/newtable/newtable.component';

@NgModule({
  declarations: [
    AppComponent,
    InactiveusersComponent,
    CalendarComponent,
    InactiveItemComponent,
    NewtableComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    BrowserAnimationsModule,
    MatTableModule,
    MatDatepickerModule,
    MatButtonModule,
    MatFormFieldModule
  ],
  exports:[
    MatDatepickerModule,
    MatButtonModule
  ],
  providers: [MatFormFieldModule,MatDatepickerModule],
  bootstrap: [AppComponent]
})
export class AppModule { }

calendar.component.html

<input #startDate  type="date" name="startdate">
<input #endDate type="date"name="enddate">

<button (click)="sendRange(startDate.value,endDate.value)" mat-button color="primary">Submit</button>

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

ERROR Error: MatDatepicker: No provider found for DateAdapter. You must import one of the following modules at your application root: MatNativeDateModule, MatMomentDateModule, or provide a custom implementation.
    at createMissingDateImplError (datepicker.js:37)
    at new MatDatepickerInput (datepicker.js:2344)
    at createClass (core.js:24577)
    at createDirectiveInstance (core.js:24386)
    at createViewNodes (core.js:34994)
    at callViewAction (core.js:35444)
    at execComponentViewsAction (core.js:35349)
    at createViewNodes (core.js:35023)
    at callViewAction (core.js:35444)
    at execComponentViewsAction (core.js:35349)

Answer 1

我知道了，这里工作正常只需在 APP.MODULE.TS 文件中导入模块

import {MatNativeDateModule} from '@angular/material/core';
imports: [

...

MatNativeDateModule 
],