Recabamos en diferentes foros para así brindarte la respuesta a tu duda, en caso de alguna pregunta deja tu pregunta y te contestaremos con gusto.
Solución:
Después de actualizar a Angular 9 (lanzado hoy), también encontré este problema y descubrí que hicieron el cambio radical mencionado en la respuesta. No puedo encontrar una razón por la que hicieron este cambio.
Tengo un archivo material.module.ts que importo / exporto todos los componentes del material (no es el más eficiente, pero es útil para un desarrollo rápido). Revisé y actualicé todas mis importaciones en las carpetas de materiales individuales, aunque un barril index.ts podría ser mejor. Una vez más, no estoy seguro de por qué hicieron este cambio, pero supongo que tiene que ver con la eficiencia de sacudir árboles.
Incluyendo mi material.module.ts a continuación en caso de que ayude a alguien, está inspirado en otros módulos de material que he encontrado:
NOTA: Como se ha mencionado en otras publicaciones de blog y según mi experiencia personal, tenga cuidado al utilizar un módulo compartido como el que se muestra a continuación. Tengo 5 ~ módulos de funciones diferentes (carga diferida) en mi aplicación en los que importé mi módulo de material. Por curiosidad, dejé de usar el módulo compartido y, en su lugar, solo importé los componentes de material individuales que necesitaba cada módulo de funciones. Esto redujo bastante el tamaño de mi paquete, casi una reducción de 200 kb. Supuse que el proceso de optimización de compilación eliminaría correctamente cualquier componente no utilizado por mis módulos, pero no parece ser el caso …
// material.module.ts
import ModuleWithProviders, NgModule from "@angular/core";
import MAT_LABEL_GLOBAL_OPTIONS, MatNativeDateModule, MAT_DATE_LOCALE from '@angular/material/core';
import MatIconRegistry from '@angular/material/icon';
import MatAutocompleteModule from '@angular/material/autocomplete';
import MatBadgeModule from '@angular/material/badge';
import MatButtonModule from '@angular/material/button';
import MatButtonToggleModule from '@angular/material/button-toggle';
import MatCardModule from '@angular/material/card';
import MatCheckboxModule from '@angular/material/checkbox';
import MatChipsModule from '@angular/material/chips';
import MatStepperModule from '@angular/material/stepper';
import MatDatepickerModule from '@angular/material/datepicker';
import MatDialogModule from '@angular/material/dialog';
import MatExpansionModule from '@angular/material/expansion';
import MatFormFieldModule from '@angular/material/form-field';
import MatGridListModule from '@angular/material/grid-list';
import MatIconModule from '@angular/material/icon';
import MatInputModule from '@angular/material/input';
import MatListModule from '@angular/material/list';
import MatMenuModule from '@angular/material/menu';
import MatPaginatorModule from '@angular/material/paginator';
import MatProgressBarModule from '@angular/material/progress-bar';
import MatProgressSpinnerModule from '@angular/material/progress-spinner';
import MatRadioModule from '@angular/material/radio';
import MatRippleModule from '@angular/material/core';
import MatSelectModule from '@angular/material/select';
import MatSidenavModule from '@angular/material/sidenav';
import MatSliderModule from '@angular/material/slider';
import MatSlideToggleModule from '@angular/material/slide-toggle';
import MatSnackBarModule from '@angular/material/snack-bar';
import MatSortModule from '@angular/material/sort';
import MatTableModule from '@angular/material/table';
import MatTabsModule from '@angular/material/tabs';
import MatToolbarModule from '@angular/material/toolbar';
import MatTooltipModule from '@angular/material/tooltip';
import MatTreeModule from '@angular/material/tree';
@NgModule(
imports: [
MatAutocompleteModule,
MatBadgeModule,
MatButtonModule,
MatButtonToggleModule,
MatCardModule,
MatCheckboxModule,
MatChipsModule,
MatStepperModule,
MatDatepickerModule,
MatDialogModule,
MatExpansionModule,
MatFormFieldModule,
MatGridListModule,
MatIconModule,
MatInputModule,
MatListModule,
MatMenuModule,
MatPaginatorModule,
MatProgressBarModule,
MatProgressSpinnerModule,
MatRadioModule,
MatRippleModule,
MatSelectModule,
MatSidenavModule,
MatSliderModule,
MatSlideToggleModule,
MatSnackBarModule,
MatSortModule,
MatTableModule,
MatTabsModule,
MatToolbarModule,
MatTooltipModule,
MatTreeModule,
MatNativeDateModule
],
exports: [
MatAutocompleteModule,
MatBadgeModule,
MatButtonModule,
MatButtonToggleModule,
MatCardModule,
MatCheckboxModule,
MatChipsModule,
MatStepperModule,
MatDatepickerModule,
MatDialogModule,
MatExpansionModule,
MatFormFieldModule,
MatGridListModule,
MatIconModule,
MatInputModule,
MatListModule,
MatMenuModule,
MatPaginatorModule,
MatProgressBarModule,
MatProgressSpinnerModule,
MatRadioModule,
MatRippleModule,
MatSelectModule,
MatSidenavModule,
MatSliderModule,
MatSlideToggleModule,
MatSnackBarModule,
MatSortModule,
MatTableModule,
MatTabsModule,
MatToolbarModule,
MatTooltipModule,
MatTreeModule,
MatNativeDateModule
],
providers: [
]
)
export class MaterialModule
constructor(public matIconRegistry: MatIconRegistry)
// matIconRegistry.registerFontClassAlias('fontawesome', 'fa');
static forRoot(): ModuleWithProviders
return
ngModule: MaterialModule,
providers: [MatIconRegistry]
;
actualización: compruebe la respuesta de Jeff Gilliland a continuación para obtener una solución actualizada
Parece que este hilo dice que se emitió un cambio importante:
Los componentes ya no se pueden importar a través de “@ angular / material”. Utilice los puntos de entrada secundarios individuales, como @ angular / material / button.
Actualizar: puedo confirmar, este era el problema. Después de degradar @angular/[email protected]
para @angular/[email protected]
podríamos resolver esto temporalmente. Supongo que necesitamos actualizar el proyecto para una solución a largo plazo.
Esto se puede resolver escribiendo la ruta completa, por ejemplo, si desea incluir MatDialogModule
seguir:
Antes de @ angular / material 9.xx
import MatDialogModule from "@angular/material";
//leading to error mentioned
Según @ angular / material 9.xx
import MatDialogModule from "@angular/material/dialog";
//works fine
Referencia de cambio de ruptura del registro de cambios oficial: https://github.com/angular/components/blob/master/CHANGELOG.md#material-9
Te mostramos las reseñas y valoraciones de los usuarios
Si haces scroll puedes encontrar las explicaciones de otros administradores, tú además puedes mostrar el tuyo si lo deseas.