在我的应用程序中实现ngx-spinner
时,我遇到了以下错误。
Error::
ERROR NullInjectorError: StaticInjectorError(AppModule)[NgxSpinnerComponent -> NgxSpinnerService]:
StaticInjectorError(Platform: core)[NgxSpinnerComponent -> NgxSpinnerService]:
NullInjectorError: No provider for NgxSpinnerService!
at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (http://localhost:4200/main.43124f86d80c92a84b74.js:15749:25)
我下面解释一下我的代码。
report.module.ts:
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ReportsRoutingModule } from './reports-routing.module';
import { ReportsComponent } from './reports.component';
import { HeaderComponent } from './header/header.component';
import { SidenavComponent } from './sidenav/sidenav.component';
import { HomeComponent } from './home/home.component';
import { MatSidenavModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { MatListModule } from '@angular/material/list';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
import { MatBadgeModule } from '@angular/material/badge';
import { MatDialogModule } from '@angular/material/dialog';
import { MatGridListModule } from '@angular/material/grid-list';
import { MatCardModule } from '@angular/material/card';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatMenuModule } from '@angular/material/menu';
import { MatTabsModule } from '@angular/material/tabs';
import { MatTableModule } from '@angular/material/table';
import { MatButtonToggleModule } from '@angular/material/button-toggle';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatPaginatorModule } from '@angular/material/paginator';
import {MatDatepickerModule} from '@angular/material/datepicker';
import {MatNativeDateModule} from '@angular/material';
import {FormsModule,ReactiveFormsModule} from '@angular/forms';
import { OrdersComponent } from './orders/orders.component';
import { PivotOrdersComponent } from './pivot-orders/pivot-orders.component';
import {MatExpansionModule} from '@angular/material'
import { NgxMatSelectSearchModule } from 'ngx-mat-select-search';
import { FilterPipe } from './filter.pipe';
import {MatSortModule} from '@angular/material/sort';
//import { NgxDaterangepickerMd } from 'ngx-daterangepicker-material';
import { NgxSpinnerModule } from "ngx-spinner";
@NgModule({
declarations: [ReportsComponent, HeaderComponent, SidenavComponent, HomeComponent, OrdersComponent, PivotOrdersComponent,FilterPipe],
imports: [
CommonModule,
ReportsRoutingModule,
MatSidenavModule,
MatInputModule,
MatExpansionModule,
MatToolbarModule,
MatMenuModule,
MatIconModule,
MatCheckboxModule,
MatTabsModule,
MatTableModule,
MatDatepickerModule,
MatNativeDateModule,
MatSnackBarModule,
MatListModule,
MatButtonModule,
MatButtonToggleModule,
MatFormFieldModule,
MatGridListModule,
MatSelectModule,
MatDialogModule,
MatBadgeModule,
MatCardModule,
FormsModule,
ReactiveFormsModule,
MatInputModule,
MatButtonModule,
MatCardModule,
MatGridListModule,
MatFormFieldModule,
MatInputModule,
MatSelectModule,
MatIconModule,
MatDialogModule,
MatButtonModule,
MatPaginatorModule,
NgxMatSelectSearchModule,
MatSortModule,
NgxSpinnerModule
// NgxDaterangepickerMd.forRoot()
]
})
export class ReportsModule { }
我在应用程序中有一个报告模块,现在正在实施。下面我将解释我的组件。
report/home/home.componet.html:
<ngx-spinner bdColor="rgba(51, 51, 51, 0.8)" size="default" type="ball-spin-clockwise">
<p style="color: white">Please Wait. </p>
</ngx-spinner>
report/home/home.component.ts:
import { NgxSpinnerService } from "ngx-spinner";
所以,在我的主页组件中,我使用了这个模块,但在我的生产构建中它却报错了。请问有人可以帮我解决这个错误吗?
ng serve --prod --optimization=false
来检测此问题。但是当我仅运行 ng serve 时,它可以正常工作。这只是 dist 文件夹的错误。 - subhra_edqart