загрузка файла mat StaticInjectorError (AppModule) [HttpHandler -> Injector]

Question

Привет, я работаю с Angular 9 и Angular Материал ... Я хочу использовать Mat-File-Upload, но при запуске приложения это показывает следующее сообщение об ошибке: "StaticInjectorError (AppModule) [HttpHandler -> Injector ] "

Я действительно немного искал inte rnet, но не могу понять проблему ... Я думаю, что это возможно, что-то делать с инжектором или провайдером, но я скучаю по тому, что все остальные компоненты работают нормально.

Код TS

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatFileUploadModule } from 'mat-file-upload'  //this not work 
import { MatButtonModule } from '@angular/material/button'; //this work!
import { HttpClientModule } from '@angular/common/http';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    MatButtonModule,
    MatFileUploadModule,
    HttpClientModule
  ],
  providers: []
})
export class AppModule { }

HTML

<div class="common-container">
  <mat-file-upload></mat-file-upload>

  <button mat-button>Click me!</button> <!--works when not add mat-file-upload-->

</div>

Answer 1

Трудно посмотреть на ваш код и найти ошибку. Можете ли вы использовать стандартный способ от Angular?

1. создать material.module.ts как это

import { NgModule } from '@angular/core';
import { 
  ...
} from '@angular/material';
import { MatFileUploadModule } from 'mat-file-upload';

@NgModule({
imports: [
  ...
  MatFileUploadModule
],
exports: [
  ...
  MatFileUploadModule
 ]
})
export class MaterialModule { }

Из вашего основного модуля. Здесь я использую MatFileUploadModule в components.module.ts, поэтому мне нужно импортировать material.module.ts в components.module.ts

Примечание: я ДОЛЖЕН импортировать его в текущий модуль, который использует ваш material.module.ts.

Полагаю, вы что-то не так сделали на этом шаге.

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
...
import { MaterialModule } from '.../material.module';

@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ...,
    MaterialModule
  ],
  exports: [
    ...
  ],
  entryComponents: [ 
    ...
  ]
})
export class ComponentsModule { }

Я думаю, это решит вашу проблему.