2017-11-13 9 views
0

私は自分自身でNGでアプリケーションを構築していて、コンポーネントのパイプを共有モジュールから使用して問題を実行しています。共有モジュールのコンポーネント内のパイプ

共有モジュール(他のすべてのものを切り出す):

import { NgModule } from '@angular/core'; 
import { FilterByPipe, OrderByPipe } from './pipes/index'; 


@NgModule({ 
    imports: [], 
    declarations: [FilterByPipe], 

    exports: [ 
     //Pipes 
     FilterByPipe, 
    ], 

    providers: [FilterByPipe] 

}) 
export class SharedModule { } 

私の質問は、どのように私は別のコンポーネントのコード内からエクスポートされたパイプFilterByPipeを使用することができますか?すなわち

export class ViewSomethingComponent implements OnInit { 
    constructor(private _filterBy: FilterByPipe) 

    filterSomething(data){ this._filterBy.transform(data,{a:'value'})} 
} 

私が直接パイプを輸入しようとしているが、その親モジュールから提供されていないとして、それは私に依存の問題を提供します。親モジュールにpipを追加してから、それを依存性注入のプロバイダとして使用する以外に、共有コンポーネントによってエクスポートされたパイプを使用する他の方法はありませんか?

答えて

0

SharedModuleをルートAppModuleにインポートします。

AppModuleの任意のコンポーネントでFilterByPipeを簡単に使用できます。

import { FilterByPipe } from '@angular/common'; 
class FilterByPipe { 
    constructor(private fillterPipe: FilterByPipe) {} 
    transformData(data) { 
    this.fillterPipe.transform(data); 
    } 
} 

し、以下を追加したり、私はHTML内のパイプを使用することができますが、あなたはエラー

providers: [FilterByPipe] 
+0

を取得します( '{{someDataが| filterby: 'の値'}}')を注入しようとしていますこれをコントローラに渡すと、クラスが見つからないというエラーが返されます。 – Doug

+0

私は答えを更新しました。より明確な表示のためにこれを見てください:https://stackoverflow.com/questions/35144821/angular-2-4-use-pipes-in-services-and-components –

関連する問題