Viewed   266 times

I am currently knee deep in making a currency formatter directive for an Angular 4 app. on the parse strip out everything other than the numbers and the decimal and end up with a stringified float, but I need it to return as a float so I can do math with it.

parse(value: string, fractionSize: number = 2): number {
  let val = value.replace(/([^0-9.])+/ig, '');
  let [ integer, fraction = "" ] = (val || "").split(this.DECIMAL_SEPARATOR);
  integer = integer.replace(new RegExp(this.THOUSANDS_SEPARATOR, "g"), "");
  fraction = parseInt(fraction, 10) > 0 && fractionSize > 0
    ? this.DECIMAL_SEPARATOR + (fraction + PADDING).substring(0, fractionSize)
    : "";
  let result = `${integer}${fraction}`;
  // at this point result = "100.55";
  result = parseFloat(result); // this refuses to compile saying "Type 'number' is not assignable │ to type 'string'"
  return result;



The two lines:

let result = `${integer}${fraction}`;
result = parseFloat(result);

are the problem. Typescript is pretty good about infering the type of a variable when it's not explicitly declared. In this case, because you assign a string to the result, typescript infers it's type as a string. To fix this, you have two options. First, explicitly declare the type of that variable so that it allows both strings and numbers:

let result: string|number = `${integer}${fraction}`;
result = parseFloat(result); // now should be ok.

Or you can assign the parsed number to a new variable, instead of reusing the result variable:

let result = `${integer}${fraction}`;
let numberResult = parseFloat(result); // now should be ok.
Saturday, September 3, 2022

Remove "type": "module" from package.json

Monday, October 10, 2022

This thread pointed me in the right direction, as I have to add the types to the tsconfig.json:

  "compilerOptions": {
    "target": "ES6",
    "types": ["node", "mocha", "chai"],

The types option also have a verbose documentation.

Saturday, November 12, 2022

The compiler doesn't know too much about the inner workings of localStorage.getItem and doesn't make the assumption that the return value will be the same from one call of getItem to the next. So it just tells you that it can't be certain that on the second call to getItem the result isn't null.

Try simply passing in the variable you've already created instead of reading from localStorage again:

if (typeof storedPortfolio === 'string') {
  moonPortfolio = JSON.parse(storedPortfolio);
Wednesday, December 14, 2022

It looks like Grid accepts not any number, but a restricted set of numbers called GridSpacing. See the type declaration 1 and 2. So after converting to a number as you did, you'll need to cast that number to a GridSpacing:

<Grid container className={classes.demo} justify="center" spacing={Number(spacing) as GridSpacing}>

And add to your imports:

import { GridSpacing } from '@material-ui/core/Grid';
Sunday, December 4, 2022
Only authorized users can answer the search term. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :