How to number format in angular2 using type script?

Question

e.g. My amount value is like (651156) and I want to display automatically like (6,51,156) using type script.

Answer 1

There is no such thing as TypeScript runtime functionality. A library could add a number format function but it will always be a JavaScript facility.

I am writing this because the framing of the question suggests a misunderstanding that may harm you later.

When you want to solve these problems, understand that TypeScript is a language that provides two things.

A. Tooling such as intellisense, static error checking, validation of API usage via types (manifest and inferred).

B. Transpilation of new or even prospective JavaScript features into older JavaScript syntax so you can use the latest JavaScript language features today.

It is not a runtime, it is a complementary set of tools that works with and enhances JavaScript for JavaScript.

So if you need to perform some computation, don't ask how to do it in TypeScript, ask how to do it in JavaScript, the answer will always be the same and you will get more responses.

Answer 2

In Angular 2 you would use pipes for that. https://angular.io/docs/ts/latest/guide/pipes.html Don't use the pure JS function that @ricky link shows, turn that into a pipe:

//imports

@Pipe({name: 'commaSeparatedNumber'})
export class CommaSeparatedNumberPipe implements PipeTransform {
  transform(value:number) : string{
    return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  }
}

Add the commaSeparatedNumber to your declarations in the NgModule and you can use it like

{{ myNumber | commaSeparatedNumber }}

By the way, for decimals there would be a built-in pipe available in the CommonModule (which is also included in the FormsModule and BrowserModule): https://angular.io/docs/ts/latest/api/common/index/DecimalPipe-pipe.html