Whenever I a try something like this in view template it is working as expected.

{{20*30}}

but whenever I try

{{somevalue1*somevalue2}}

Where somevalue1 and somevalue2 both are ing from ponent and somevalue2 is ing from api and it is inside an array, it is displaying NaN.

How to deal with that?

Is it because of the String value?

How to convert that in Number in template?

Whenever I a try something like this in view template it is working as expected.

{{20*30}}

but whenever I try

{{somevalue1*somevalue2}}

Where somevalue1 and somevalue2 both are ing from ponent and somevalue2 is ing from api and it is inside an array, it is displaying NaN.

How to deal with that?

Is it because of the String value?

How to convert that in Number in template?

• javascript
• angular
• angular2-template

• 3 Please, share more code. Specifically, javascript code to get a better view of how you're getting data. Further, share the types of those variables. – Ele Commented Dec 31, 2017 at 16:12

3 Answers 3

Is it because of the String value?

Yes, it is. You can't easily access the windows scope in template scope, so I would make a method:

calculateStuff(){
  return Number(somevalue1) * Number(somevalue2);
}

And in template:

{{calculateStuff()}}

If the string doesn't start with characters representing number, it will still return NaN.

somevalue1 somevalue2 are probably strings. You'll need to share more code to get a real answer, though.

Add {{somevalue1}} and {{somevalue2}} to the template as well, just so you can be sure the template is receiving the values you expect.

Problem is the string value that is formatted according to some locale ( in your case it is US locale )

You can eighter:

• convert the strings to values on data retrieving
• create angular transform pipe
• use a helper function/method in your template
• if you are able, adjust data on the server side (it is a good practice sending raw data and formatting them when needed)

There are several ways how to handle the conversion. If this is the only format you receive that numbers. Simply replace the ma Number('1,234.42'.replace(',', '')) or use some of the libs that were created for this purpose like NumeralJS