6

我已将分页逻辑放在一个单独的模块中,并将其导入AppModule. 下面是我的分页模块代码和AppModule.

PagingUtilities 模块:

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
      ]
    }
  }
}

应用模块:

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是管道,我在 my 中提供它们,我正在将它们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.

请帮我解决一下这个。

4

1 回答 1

3

您可以尝试将FilterPipeOrderByPipe管道添加到export[]属性中,如下所示:

exports: [
    FilterPipe, 
    OrderByPipe,
    SortByDirective,
    PaginationComponent
]

希望这有帮助!

于 2017-10-23T07:45:01.780 回答