Block Round Off using decimal pipe in angular 4

被刻印的时光 ゝ 提交于 2019-11-28 10:49:57

问题


Using angular 4,

{{31.94 | number:'1.0-0'}} 

Output: 32

Any idea, how to block the round off. Expecting the result is 31


回答1:


You need to create your custom pipe as DecimalPipe doesn't provide any floor feature. Plus you can add your decimal pipe in it. Your Custom Pipe:

@Pipe({name: 'floor'})
export class FloorPipe implements PipeTransform {
    /**
     *
     * @param value
     * @returns {number}
     */
    transform(value: number): number {
        return Math.floor(value);
    }
}

Use in template as:

  <span>{{ yournumber | floor | your_decimal_pipe }}</span>



回答2:


your.component.ts

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


@Pipe({name: 'DecimalPipe'})
export class NumNotRoundPipe implements PipeTransform {
  transform(value: number): number {
    var num1 = Math.floor(value * 100) / 100;
    return num1;
  }
}

your.module.ts

import {NumNotRoundPipe} from './your.component'

@NgModule({
    imports: [
    ],
    declarations: [
        NumNotRoundPipe
    ],
    entryComponents: [

    ],
    providers: [

    ],
    schemas: [CUSTOM_ELEMENTS_SCHEMA]
})

your.component.html

<span>{{yourNumber | DecimalPipe:'1.2-2'}}</span>



回答3:


You might not need an extra custom pipe. Output is a string and there are plenty of string pipes. You might truncate like this :

{{31.94 | slice:0:2}}
//Output : 31

Would achieve your desired output in that specific case.

{{1.94 | number:'2.2-2' | slice:0:2}}
//Output : 01

You'll still want to use custom pipe for now if you don't want padding 0.



来源:https://stackoverflow.com/questions/47416447/block-round-off-using-decimal-pipe-in-angular-4

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!