我已将我的分页逻辑放在一个单独的模块中,并将其导入AppModule
。以下是我的分页模块和AppModule
的代码。
PagingUtilitiesModule:
import { NgModule, ModuleWithProviders, Injector } from '@angular/core';
import { CommonModule } from '@angular/common';
import { OrderByPipe } from './order-by.pipe';
import { FilterPipe } from './filter.pipe';
import { SortByDirective } from './sort-by.directive';
import { PaginationComponent } from './pagination/pagination.component';
import { ServiceLocator } from './service-locator';
@NgModule({
imports: [
CommonModule
],
declarations: [
SortByDirective,
PaginationComponent
],
exports: [
SortByDirective,
PaginationComponent
]
})
export class PagingUtilitiesModule {
constructor(private injector: Injector) {
ServiceLocator.injector = this.injector;
}
static forRoot(): ModuleWithProviders {
return {
ngModule: PagingUtilitiesModule,
providers: [
FilterPipe,
OrderByPipe
]
}
}
}
的AppModule:
import { NgModule } from '@angular/core';
import { Location } from '@angular/common';
import { BrowserModule } from '@angular/platform-browser';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { MultiselectDropdownModule } from 'angular-2-dropdown-multiselect';
import { FileUploadModule } from 'ng2-file-upload';
import { SlimLoadingBarModule } from 'ng2-slim-loading-bar';
import { AppRoutingModule } from './app-routing/app-routing.module';
import { PagingUtilitiesModule } from './shared/paging-utilities/paging-utilities.module';
import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { AgreementComponent } from './agreement/agreement.component';
import { DatepickerDirective } from './shared/datepicker.directive';
import { HeaderComponent } from './header/header.component';
import { CreatePriceListComponent } from './create-price-list/create-price-list.component';
import { ExcelReaderService } from './shared/excel-reader.service';
import { AgreementDetailsService } from './agreement/agreement-details.service';
import { LoaderInterceptorService } from './shared/loader-interceptor.service';
import { ContractComponent } from './contract/contract.component';
import { EditableControlComponent } from './shared/editable-control/editable-control.component';
import { SearchService } from './home/search.service';
import { FilesComponent } from './agreement/files/files.component';
import { SearchComponent } from './home/search/search.component';
@NgModule({
imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule,
HttpClientModule,
MultiselectDropdownModule,
FileUploadModule,
SlimLoadingBarModule.forRoot(),
AppRoutingModule,
PagingUtilitiesModule.forRoot()
],
declarations: [
AppComponent,
HomeComponent,
LoginComponent,
AgreementComponent,
DatepickerDirective,
HeaderComponent,
CreatePriceListComponent,
ContractComponent,
EditableControlComponent,
FilesComponent,
SearchComponent
],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: LoaderInterceptorService,
multi: true
},
ExcelReaderService,
AgreementDetailsService,
SearchService,
Location
],
bootstrap: [AppComponent]
})
export class AppModule { }
正如您所看到的,OrderByPipe
和FilterPipe
是管道,我在我的PagingUtilitiesModule
中提供它们,我将PagingUtilitiesModule.forRoot()
导入AppModule
}。它在文件更改时正常构建时工作正常。但当我ng build --prod
时,它显示此错误
ERROR in Error: Cannot determine the module for class OrderByPipe in D:/Projects/AMSSFrontEnd/src/app/shared/paging-utilities/order-by.pipe.ts! Add OrderByPipe to the NgModule to fix it.
Cannot determine the module for class FilterPipe in D:/Projects/AMSSFrontEnd/src/app/shared/paging-utilities/filter.pipe.ts! Add FilterPipe to the NgModule to fix it.
请帮助我。
答案 0 :(得分:2)
您可以尝试将FilterPipe
和OrderByPipe
管道添加到export[]
属性中,如下所示:
exports: [
FilterPipe,
OrderByPipe,
SortByDirective,
PaginationComponent
]
希望这有帮助!