web-dev-qa-db-ja.com

angle2のカスタムパイプで通貨や数値のようなパイプを拡張します

カスタムパイプのnumberPipeに電話したいのですが、この答えが見つかりました

Angular2はカスタムパイプで基本パイプを使用します

しかし、私はこの解決策は私にはうまくいきません。 「パイプ 'bigInteger'が見つかりませんでした」というエラーがあります

import { Pipe, PipeTransform } from "@angular/core"
import { CurrencyPipe  } from "@angular/common"

@Pipe({
 name: "bigInteger"
 })
 export class BigInteger extends CurrencyPipe implements PipeTransform {
   transform(value: any): string {
    return value
 }
}
angulartypescriptpipe
12
imtah

更新

少なくともAngular4ではしばらくの間これを修正する必要があります

オリジナル

他のクラスを拡張するDIおよびクラスには既知の問題があります

https://github.com/angular/angular/issues/8694

Utilこれは修正され、継承の代わりにコンポジションを使用できます。

@Pipe({
  name: "bigInteger"
})
export class BigInteger implements PipeTransform {

  constructor(private currencyPipe:CurrencyPipe) {}

  transform(value: any): string {
     return this.currencyPipe.transform(value);
  }
}
8
Günter Zöchbauer

おそらく時代遅れですが、これは私にとってはうまくいきました（Angular 5）：

import { Pipe, PipeTransform } from '@angular/core';
import { DecimalPipe } from '@angular/common'

@Pipe({
  name: 'bigInteger'
})
export class BigInteger extends DecimalPipe implements PipeTransform {
  transform(value: any, args?: any): any {

    let result;
    result = super.transform(value, args);

    //any transformations you need

    return result;
  }

}

次に、通常のnumberパイプのように使用しますが、必要に応じてカスタマイズできます。

<span>{{someValue | bigInteger : '1.2-2'}}</span>
6
Ivan Amelyanenka