módulo compartido de Angular que distribuye varios módulos de @angular/material NullInjectorError: No se encontró ningún proveedor
Tengo un uiModule. Importa y exporta varios módulos de @angular/material.
Había esperado que cuando importo uiModule
en anotherModule
; ahora anotherModule
tendría acceso a las cosas de @angular/material… Pero eso no está funcionando exactamente.
Mientras que material funciona bien dentro de uiModule
— anotherModule
reconoce los elementos de material; sin embargo, hay muchos errores como:
NullInjectorError: ¡No hay un proveedor para InjectionToken mat-menu-scroll-strategy!
NullInjectorError: ¡No hay un proveedor para Overlay!
Obtuve esos ejemplos después de intentar usar <mat-menu>
.
Aquí tienes un vistazo al uiModule:
// material
import { MatExpansionModule } from '@angular/material/expansion';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatChipsModule } from '@angular/material/chips';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatNativeDateModule } from '@angular/material/core';
import { MatIconModule } from '@angular/material/icon';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatDialogModule } from '@angular/material/dialog';
const material = [
MatIconModule,
MatProgressSpinnerModule,
MatProgressBarModule,
MatExpansionModule,
MatInputModule,
MatChipsModule,
MatAutocompleteModule,
MatFormFieldModule,
MatDatepickerModule,
MatNativeDateModule,
MatMenuModule,
OverlayModule,
MatDialogModule,
ScrollingModule,
];
@NgModule({
declarations: [
PaginationComponent,
],
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
...material,
],
providers: [],
exports: [
PaginationComponent,
...material,
],
})
davy.ai
El problema que estás encontrando se debe a que
uiModule
no está exportando los proveedores necesarios para algunos de los componentes de@angular/material
de la manera correcta. Específicamente,MatMenuModule
requiereOverlayModule
, el cual no está siendo exportado poruiModule
de una manera que pueda ser consumida poranotherModule
.Para solucionar este problema, puedes agregar
OverlayModule
al arregloexports
enuiModule
de la siguiente manera:Esto asegurará que
anotherModule
tenga acceso al proveedorOverlayModule
cuando se importeuiModule
.Si continúas experimentando problemas con otros proveedores, puedes agregarlos al arreglo
exports
de la misma manera. Solo asegúrate de que todos los proveedores necesarios estén incluidos en el arregloexports
para cualquier módulo que importeuiModule
.