Can't bind to 'matDatepicker' since it isn't a known property of 'input' - Angular

Question

I have just copied and pasted angular material code for datePicker and input, but I am getting this error for the datePicker.

app.module

Answer 1

Below import works for me my on my solution in Angular8

@NgModule ({
        imports: [
            MatDatepickerModule,
            MatNativeDateModule,
        ]
 });

Answer 2

While using mat-datepicker, you have to import MatDatepickerModule as well, also MatNativeDateModule is recommended to be imported too. see docs here.

import { MaterialModule, MatDatepickerModule, MatNativeDateModule } from '@angular/material';
@NgModule({
  imports: [
    ...
    MaterialModule,            // <----- this module will be deprecated in the future version.
    MatDatepickerModule,        // <----- import(must)
    MatNativeDateModule,        // <----- import for date formating(optional)
    MatMomentDateModule         // <----- import for date formating adapted to more locales(optional)
  ]

For optional module of date formating, see Module for DateAdapter from material team.

Mention: please avoid using MaterialModule for it'll be deprecated in the future.

Answer 3

To use MatDatePicker in application add following line in your app.module.ts file:

1. import MatDatepickerModule, MatNativeDateModule in you app.module.ts.

   For example:

   import { MatDatepickerModule, MatNativeDateModule } from '@angular/material';

2. Add MatDatepickerModule, MatNativeDateModule uner @NgModule in imports and exports:

**

@NgModule ({
            imports: [
                MatDatepickerModule,
        MatNativeDateModule 
            ],
            exports: [
                MatDatepickerModule, 
                MatNativeDateModule 
            ]
        })

**

Answer 4

You just need to import below module

import {MatDatepickerModule} from '@angular/material/datepicker';

@NgModule ({
  imports: [
    MatDatepickerModule
   ]
  })

Answer 5

you need to import FormsModule and ReactiveFormsModule if you used NgModule and formgroup. so your app.module should be like that

import {MaterialModule} from '@angular/material';
@NgModule({
  imports: [
    MdDatepickerModule,        
    MdNativeDateModule,
    FormsModule,
    ReactiveFormsModule
  ]

Note: MaterialModule Removed. please use separate module instead. like MdDatepickerModule see here https://github.com/angular/material2/blob/master/CHANGELOG.md#200-beta11-carapace-parapet-2017-09-21