Components: List of Material Module Names : Doc

[moorthi07]

Bug, feature request, or proposal:

No documentation to quickly find the Material component module names, since MaterialModule and MaterialRoodModules are deprecated.

What is the expected behavior?

One would want to quickly look up material component module name to include or create own set of moudule

YOUR MATERIAL MODULES (For the component / element name just remove the 'Module' part from the module name - some may not match exactly)

In most cases

Module Name = ComponentName +"Module"

ComponentName = ModuleName - "Module"

const YOUR_MATERIAL_MODULES = [
MdAutocompleteModule,
MdButtonModule,
MdButtonToggleModule,
MdCardModule,
MdChipsModule,
MdCheckboxModule,
MdDialogModule,
MdGridListModule,
MdIconModule,
MdInputModule,
MdListModule,
MdMenuModule,
MdProgressBarModule,
MdProgressSpinnerModule,
MdRadioModule,
MdRippleModule,
MdSelectModule,
MdSidenavModule,
MdSliderModule,
MdSlideToggleModule,
MdSnackBarModule,
MdTabsModule,
MdToolbarModule,
MdTooltipModule,
OverlayModule,
PortalModule,
RtlModule,
StyleModule,
A11yModule,
PlatformModule,
CompatibilityModule,
ObserveContentModule
];

[jmcgoldrick]

I really would have liked to see the MaterialModule maintained by the team with docs strongly suggesting you create your own only containing the modules you use before going to production. The lack of the "all components module" slows down prototyping and raises the barrier to entry. At the very least, a canonical list of modules should be maintained

[jelbourn]

Where would you expect this documentation to live?

[jmcgoldrick]

It's a tough one, one of those things (like maintaining the module) that is overhead on your end - is it something that is a candidate to be generated with build tooling etc?

[jelbourn]

Even if it were autogenerated, I'm not sure there's a discoverable place for it.

[moorthi07]

I'd like to see the list of components, the module names maintained - as a reference page , automatically generated in 'material.angular.io'. It could be under the 'Guide' link added as 4th one. Developers always like to see a cheatsheet kind of look of the technology, the reference page will serve that purpose. (I do) . This avoids ton of clicks to just to find one syntax or so and we also don't like to remember if working in fullstack with many tools and languages, which is the norm these days.

[fxck]

What's the reason to deprecate MaterialModule anyway, wouldn't it be better to simply mention in the getting started guide that the best practise is to create your module containing only the modules you use, but alternatively, if you don't care about the size or you plan to use everything, you can use MaterialModule.

[willshowell]

Worth noting rxjs' approach:

To import the entire core set of functionality:
...

To import only what you need by patching (this is useful for size-sensitive bundling):
...

[Airblader]

IMHO the getting started guide should just list all available modules. You can warn the user to only add the ones they need (as is already the case), but a getting started guide should help a newcomer to get an app started as quickly as possible. Having to figure out which modules there are and what they are named is a lot of overhead when likely already learning a lot of new stuff.

I don't think we'd need a module that is part of the library – simply listing them in the getting started guide would already help a vast majority of people.

[Airblader]

For some reference, I tried to add a date picker into a newly created app right now. After figuring out that I need MatDatepickerModule, I was greeted by an error that I needed a date adapter. The log message helpfully named the moment adapter, but it couldn't be found, so eventually I settled for the native adapter for now. Next up was a cryptic error message for which I found the solution in #7898, namely having to also import MatInputModule.

This kind of investigative work just to get started is IMHO too much.

[rjh427]

It's been more than 8 months, is there still no canonical list of module names?

[mackelito]

@Airblader I agree that the docs can be improved... but... "The type of values that the datepicker expects depends on the type of DateAdapter provided in your application." that should give a hint ;)

It'a a lot to read but I think it's all there.. right?

[Airblader]

It'a a lot to read but I think it's all there.. right?

I don't think so. As I said, this information would mostly be useful to newcomers to material2 – they will have a hard time understanding what to do. We could help them get started tremendously if we had a simple way of telling them which modules to import. We should want users to get started as quickly and painlessly as possible; when you start out, there are more important things to worry about than to investigate how to even set things up. :-)

[mamakawama]

Like @Airblader I just added a datepicker as part of my own helloWorld with Angular Material. It is really a speed bump to getting started with this. Angular doesn't need more speed bumps, IMHO.

[BostonChuckDuncan]

I like the concept of having all the modules listed in ONE place, BUT I just started trying to use Material, following the instructions in the GUIDE, and now I find all the modules are MAT something and I can't get them all to satisfy references in the examples (expansion is what I'm working with). Is the above list vastly out of date or am I missing something? It would have been nice to have the name of the MODULE to import WITH the documentation for the example.

[Airblader]

Some modules depend on each other. A good way to get something specific to work is to open the example from the docs in Stackblitz and seeing how it sets up the modules.

[jelbourn]

Closing this since I think the main thing I would want to do is tracked in #15340. As it stands, I think the list of components is pretty clear from the docs site as well as the pattern for component --> module name (Mat___Module)

[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._}