[Angular] 숫자형식 표시 파이프(v3)

typescript, angular

 

숫자 데이터가 0인 경우 -로 표시하기 위해 기존 number 파이프 대신 제작

 

/**
 * 숫자형식 표시
 * 데이터가 0인 경우 - 로 표시
 * options {
 *     digits: 소수점 이하 표시할 자릿수,
 *     unit: 값 뒤에 표시할 단위명,
 *     text: 값이 null 일 때 표시할 텍스트,
 * }
 * 사용법)
 *     {{ 0 | number0 }} => -
 *     {{ null | number0 }} => null
 *     {{ null | number0 : { text: '별도표시' } }} => '별도표시'
 *     {{ 1234.12345 | number0 : { digits: 2, unit: '원' } }} => 1234.12원
 *     {{ 1234.12 | number0 : { replace: '(%s㎡)' } }} => '(1,234.12㎡)'
 */
@Pipe({ name: 'number0' })
export class NumberZero implements PipeTransform {
    transform(value: number | string, options?: { digits: number, unit: string, text: string, replace: string }): string {
        if (value != null) {
            let num = null;

            if (typeof(value) === 'string') {
                num = Number(value);
                if (isNaN(num)) {
                    return null;
                }
            } else {
                num = value;
                if (isNaN(num)) {
                    return null;
                }
            }

            if (num === 0) {
                return '-';
            } else {
                if (options?.replace) {
                	return options?.replace.replace('%s', trunc(num, options?.digits));
                } else {
                	return trunc(num, options?.digits) + ((options?.unit) ? options?.unit : '');
                }
            }
        } else {
            return (options?.text) ? options?.text : null;
        }
    }
}

function trunc(number, digits) {
    const n = number + '';
    const pos = n.lastIndexOf('.');
    if (pos > -1) {
        if (digits == null) {
            digits = n.length - (pos + 1);
        }
        return parseFloat(n.substr(0, pos + digits + 1)).toLocaleString('en', { minimumFractionDigits: digits });
    } else {
        if (digits == null) {
            digits = 0;
        }
        return number.toLocaleString('en', { minimumFractionDigits: digits });
    }
}