Typescript Type 'number' is not assignable │ to type 'string'
Solution 1
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.
Solution 2
You can't assign different types to a variable in Typescript. If you initialized the variable with a string
it must remain a string
.
let result = `${integer}${fraction}`;
let resultAsNumber = parseFloat(result);
return resultAsNumber
This is a common cause of errors and the type system tries to prevent you from doing this.
Bird Dad
Updated on July 20, 2022Comments
-
Bird Dad almost 2 years
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; }