Wie zu sagen, gewinkelt (2) Währung Rohr-display, wie es ist, wenn der Wert eine Zeichenkette, die nicht int oder float

Währung Leitung sollten sein smart genug, um string, float, int, etc automatisch.

wenn der übergebene Wert wird string oder nicht int oder float ist, sollte es nichts tun und Anzeige der übergebene Wert ist, wie es ist. Und nur die Anzeige der formatierten Wert, wenn es int oder float.

War es geschieht in angularJs aber nicht geschieht, in eckige (2)

Wie zu sagen, Währungs-Rohr zu entkommen, im Falle seiner string tun und Währung Formatierung, wenn Ihr ein decimal Wert. Ich erwarte etwas wie im Bild unten gezeigt.

Beispiel

<div>Money:{{'xxx/vv/cc' | currency:'USD':true:'1.2-2'}}</div> anzeigen soll
xxx/vv/cc

<div>Money: {{''11.99'' | currency:'USD':true:'1.2-2'}}</div>
sollte die Anzeige $11.99 -- $ - symbol enthalten.

Aber es ist nicht passiert. Fehler bin ich immer caused by: Invalid argument 'Included' for pipe 'CurrencyPipe'

Ich glaube, es war passiert standardmäßig in angularjs aber in angular2 seiner nicht geschieht, indem defalut.

InformationsquelleAutor Aniruddha Das | 2016-10-20

  1. 5

    Das Handbuch ausdrücklich, dass er akzeptiert einen numerischen Ausdruck und sonst nichts:

    number_expression | Währung[:currencyCode[:symbolDisplay[:digitInfo]]]

    Ist das Rohr wirklich einfach und erweitert werden kann und anstelle des CurrencyPipe entspricht dem erwarteten Verhalten:

    const _NUMBER_FORMAT_REGEXP = /^(\d+)?\.((\d+)(-(\d+))?)?$/;

@Pipe({name: 'currency'})
export class LooseCurrencyPipe extends CurrencyPipe {
  transform(value: any, currencyCode: string, symbolDisplay: boolean, digits: string): string {
    if (typeof value === 'number' || _NUMBER_FORMAT_REGEXP.test(value)) {
      return super.transform(value, currencyCode, symbolDisplay, digits);
    } else {
      return value;
    }
  }
}

    Erstellen Sie eine neue Leitung mit anderen Namen CurrencyPipe kann injiziert werden in benutzerdefinierten Rohr:

    @Pipe({name: 'looseCurrency'})
export class LooseCurrencyPipe implements PipeTransform {
  constructor(private _currencyPipe: CurrencyPipe) {}

  transform(value: any, currencyCode: string, symbolDisplay: boolean, digits: string): string {
    if (typeof value === 'number' || _NUMBER_FORMAT_REGEXP.test(value)) {
      return this._currencyPipe.transform(value, currencyCode, symbolDisplay, digits);
    } else {
      return value;
    }
  }
}

    Damit CurrencyPipe injiziert werden, die durch DI, es sollte zusätzlich zu Modul Anbieter:

    declarations: [LooseCurrencyPipe, ...],
providers: [CurrencyPipe, ...],
    Ich habe versucht, die gleiche Weise wie Sie hier gezeigt werden, aber es hat nicht funktioniert für mich. plunker: plnkr.co/Bearbeiten/cxRU2NB7S0AQKSevmNQT?p=info
    Dies funktioniert, wenn Sie verwendet wird, wie die Antwort auf Zustände, d.h. überschreiben currency Rohr mit neuen Implementierung. Der Rahmen ist nicht glücklich, wenn ausgedehnt Rohr wird umbenannt. Tun, wie Sie versuchen, zu tun, Komposition über Vererbung Ansatz funktionieren.

    InformationsquelleAutor estus

  2. 10

    Können Sie den ternären operator a ? b : c zu zeigen b wenn a ist truthy, aber zeigen c sonst.

    Zunächst eine Funktion in der Komponente, die zurück true wenn der Wert eine Zahl ist.

    Komponente

    isNumber(e) {return typeof e === 'number'}

    Dann verwenden, um festzustellen, ob das senden der Wert der Währung, die Rohr-oder drucken Sie es direkt

    Vorlage

    <div>
    {{ isNumber(money) ? (money|currency:'USD':true:'1.2-2') : money }}  
</div>

    live demo

    InformationsquelleAutor BeetleJuice

Schreibe einen Kommentar