How to transform a string into a float through the angular template?

Question

I’m using the component agm-map and I need to move on to the properties [latitude] and [longitude] coordinates. I am receiving these values in string, but need to convert into numeric.

I tried something like:

<agm-map 
     [mapTypeId]="'hybrid'"
     [latitude]="parseFloat(local.localLatitudeB)"
     [longitude]="parseFloat(local.localLongitudeB)"
     [zoom]="16"
     [disableDefaultUI]="false">

     ...

But I get:

_co.parseFloat is not a Function

This is an example of localLongitudeB which I receive from my front, but is in string: -47.410351923

Answer 1

I don’t quite understand your difficulty, but you can’t do the parse directly in Html, this does not exist, nor with interpolations Moustache {{}} can’t, parseFloat is a Javascript function and therefore has to be declared in a Javascript file, what you can do is have 2 variables, 1 variable gets the value in string as I said and in another you save the value of parse and use as you want, as in the property in Html, an example:

TS:

latitude: string = '-47.410351923';
latNumber: number = null;

ngOnInit() {
  this.latNumber = parseFloat(this.latitude);
  console.log(typeof this.latNumber)              // tipo do valor => number : -47.410351923
}

Html:

<agm-map 
 [mapTypeId]="'hybrid'"
 [latitude]="latNumber"                           <!-- valor aqui -->
 [longitude]="longNumber"
 [zoom]="16"
 [disableDefaultUI]="false">

 ...