角度6输入类型编号,并在逗号后显示2位数字

时间:2018-07-12 13:21:24

标签: html angular typescript angular-pipe

我想显示输入,并且当用户输入数字时:src/main/webapp/app/vendor.ts我想显示20。要获得更大的数字,我希望看到像20,00这样的千位分隔符。

11 200,00

我尝试添加:

<input type="number" (ngModelChange)="calculateSum()" (change)="calculateAmount(invoiceQuota)" [ngModel]="invoiceQuota.controls.grossAmount.value">

但不起作用

我找不到解决问题的方法。

1 个答案:

答案 0 :(得分:3)

    import { Component, Input, NgZone, OnInit, Pipe, PipeTransform } from '@angular/core';

const PADDING = '00';
@Pipe({
    name: 'floatNumber'

})
export class FloatNumnberPipe implements PipeTransform {
    DECIMAL_SEPARATOR: string;
    THOUSANDS_SEPARATOR: string;

    constructor() {
    // TODO comes from configuration settings
        this.DECIMAL_SEPARATOR = '.';
        this.THOUSANDS_SEPARATOR = ',';
    }

    transform(value: number | string, fractionSize: number = 2): string {
        const ds = '.';
        const ts = ',';
        let [integer, fraction = ''] = (value || '').toString()
            .split(ds);

        fraction = fractionSize > 0
            ? ds + (fraction + PADDING).substring(0, fractionSize)
            : '';

        integer = integer.replace(/\B(?=(\d{3})+(?!\d))/g, ts);
        integer = integer ? integer : '0';
        return integer + fraction;
    }

    parse(value: string, fractionSize: number = 3): string {
        const ds = '.';
        const ts = ',';
        let [integer, fraction = ''] = (value || '').split(ds);

        integer = integer.replace(new RegExp(ts, 'g'), '');

        fraction = parseInt(fraction, 10) > 0 && fractionSize > 0
            ? ds + (fraction + PADDING).substring(0, fractionSize)
            : '';
        integer = integer ? integer : '0';
        return integer + fraction;
    }
}
 this way you can write float number PIPE and in component ,  if (typeof modelControlname === 'string') {


modelControlname=Math.round(Number(FloatNumnberPipe.prototype.parse(amount)) * 100) / 100);

  modelControlname=FloatNumnberPipe.prototype.transform(modelControlname.value);