1. ホーム
  2. ジャバスクリプト

[解決済み】複数の引数を持つAngular 2パイプを呼び出すには?

2022-04-18 04:49:22

質問

このようにパイプを呼び出すことができるのは知っています。

{{ myData | date:'fullDate' }}

ここでは、日付のパイプは引数を1つだけ取ります。 コンポーネントのテンプレートHTMLから、あるいはコード内で直接、より多くの引数を持つパイプを呼び出すには、どのような構文にすればよいのでしょうか?

どのように解決するのですか?

コンポーネントのテンプレートでは、コロンで区切ることで複数の引数を使用することができます。

{{ myData | myPipe: 'arg1':'arg2':'arg3'... }}

あなたのコードからは、次のようになります。

new MyPipe().transform(myData, arg1, arg2, arg3)

そして、パイプ内のtransform関数では、このように引数を使用することができます。

export class MyPipe implements PipeTransform { 
    // specify every argument individually   
    transform(value: any, arg1: any, arg2: any, arg3: any): any { }
    // or use a rest parameter
    transform(value: any, ...args: any[]): any { }
}

ベータ16以前(2016-04-26)

パイプはすべての引数を含む配列を取るので、このように呼び出す必要があります。

new MyPipe().transform(myData, [arg1, arg2, arg3...])

そして、transform関数は次のようになります。

export class MyPipe implements PipeTransform {    
    transform(value:any, args:any[]):any {
        var arg1 = args[0];
        var arg2 = args[1];
        ...
    }
}