コンポーネント ベース angular4 アプリがあり、すべてのコンポーネントでDataTable Plugin とカスタムDataFilterPipeを使用しています。すべてのコンポーネントで以下のようにインポートすると、取得するエラーはERROR Error: Uncaught (in promise): Error: Type DataFilterPipe is part of the 2 つのモジュールの宣言。DataFilterPipe を上位モジュールに移動することを検討してください。次に、 dataFilterModuleという新しいモジュールを作成しました
輸入:
import {DataTableModule} from "angular2-datatable";
import {DataFilterPipe} from "../plugins/datatable/datafilterpipe";
import {HttpModule} from "@angular/http";
import {FormsModule} from "@angular/forms";
dataFilterModule:
import {NgModule} from "@angular/core";
import {CommonModule} from "@angular/common";
import {DataTableModule} from "angular2-datatable";
import {DataFilterPipe} from "../plugins/datatable/datafilterpipe";
import {HttpModule} from "@angular/http";
import {FormsModule} from "@angular/forms";
@NgModule({
imports: [
CommonModule,
DataTableModule,
FormsModule,
HttpModule
],
declarations: [
DataFilterPipe
],
exports: [
DataFilterPipe
]
})
export class dataFilterModule {}
次に、このモジュールを私のAppModuleにインポートしますが!! 私が得るエラーは次のとおりです。
The pipe 'dataFilter' could not be found
以下のようにエクスポートされた dataFilterModule を追加しましたが、良いニュースはありません!
export class dataFilterModule {
static forRoot() {
return {
ngModule: DataFilterPipe,
providers: [],
};
}
}
編集: 私のカスタムフィルター:
import * as _ from 'lodash';
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'dataFilter'
})
export class DataFilterPipe implements PipeTransform {
transform(array: any[], query: string): any {
if (query) {
return _.filter(array, row=>row.name.indexOf(query) > -1);
}
return array;
}
}