Components: Clarify module import documentation for datepicker

[Danebrouwer97]

Bug, feature request, or proposal:

When following the guidelines on how to import and use Angular Material's Datepicker, it suggests importing only the MatDatepickerModule.
(source: https://material.angular.io/components/datepicker/api)

However, if only that step is done the Datepicker does not work. The date picker actually requires importing MatDatepickerModule and MatNativeDateModule as well as adding the MatDatepickerModule to the module providers.
(source: https://stackoverflow.com/questions/49720908/angular-material-matdatepicker-no-provider-found-for-dateadapter)

Further down the page contains the heading:
" Choosing a date implementation and date format settings. "
However there is no mention for the need to import it further up the page as a basic setup requirement, nor is the import shown in the examples.

What is the expected behavior?

For the Datepicker to function following the import of the MatDatepickerModule.

What is the current behavior?

The Datepicker does not function,

What are the steps to reproduce?

• import only the MatDatepickerModule
• use the Datepicker as suggested

What is the use-case or motivation for changing an existing behavior?

Clearer documentation will prevent further potential bug-reports and/or documentation-reports such as this one.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular Material: 8.1.4

[jelbourn]

@Danebrouwer97 how specifically do you propose changing the docs?

[Danebrouwer97]

All it needs is something very simple.
I am by no means a UI designer, but something along the lines of this.

The link at the bottom can take the user to the " Choosing a date implementation and date format settings. " section.

[lukaonik]

The datepicker allows users to enter a date either through text input, or by choosing a date from the calendar. It is made up of several components and directives that work together.

this is the first sentence on the Overview Page. maybe we could replace it with the following sentence

The datepicker allows users to enter a date either through text input, or by choosing a date from the calendar. It is made up of several components, directives and the date implementation module that work together.

what do you think @jelbourn ?

[Danebrouwer97]

I'd be happy with any sort of improvement. Whether it's to the Overview Page or the API Page doesn't really matter to me. I just want to prevent the next person from making the same mistake I did.

[jelbourn]

The tricky thing is that our API docs are auto-generated, so it's not super easy to just drop in a special case for the datepicker. I could see adding a brief bit to the Overview about this, but probably won't have time to do anything myself any time soon.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}