Displaying the number format in angular4

Question

I have written a custom pipe in angular 4. Basically what i am looking at is if the number is in 12.23 millions then it should display For e.g 12.2M (One decimal place). If the number is 50,000.123 then 50.1K. Please note that it should also do the same for negative numbers and consider decimals.

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

@Pipe({
  name: 'numberFormat'
})
export class NumberformatComponent implements PipeTransform {

  constructor() { }

   transform(number : any){
    if(number == 0) {
    return 0;
      }
      else
      {        
        // hundreds
        if(number <= 999){
          return number ;
        }
        // thousands
        else if(number >= 1000 && number <= 999999){
          return (number / 1000) + 'K';
        }
        // millions
        else if(number >= 1000000 && number <= 999999999){
          return (number / 1000000) + 'M';
        }
        // billions
        else if(number >= 1000000000 && number <= 999999999999){
          return (number / 1000000000) + 'B';
        }
        else
          return number ;
        }
    }

}

Answer 1

You have actually done half of the implementation. One thing to add here is the condition for the negative numbers, you can do that by checking the starting character of the string to be '-', also you can add the decimal to be fixed as 1 , using Fixed(1);

Here is the complete pipe implementation,

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

@Pipe({
  name: 'numberFormat'
})
export class NumberformatComponent implements PipeTransform {

  constructor() { }

   transform(number : any){
    let hasMinus = String(number).charAt(0) === '-' ? true:false;
    number =  String(number).charAt(0) === '-' ?
            + String(number).substring(1, number.length)  : number;
        // hundreds
        if(number <= 999){
          number = number ;
        }
        // thousands
        else if(number >= 1000 && number <= 999999){
          number = (number / 1000).toFixed(1) + 'K';
        }
        // millions
        else if(number >= 1000000 && number <= 999999999){
          number = (number / 1000000).toFixed(1) + 'M';
        }
        // billions
        else if(number >= 1000000000 && number <= 999999999999){
          number = (number / 1000000000).toFixed(1) + 'B';
        }
        if(hasMinus){
          return '-'+number;
        }else
        {
          return number;
        }
    }

}

STACKBLITZ DEMO