Typescript, toFixed. Type 'string' is not assignable to type 'number'

Question

       distanceX = ((this.frontclickedX  - originX) / originX).toFixed(2);
       distanceY = (-(this.frontclickedY - originY) / originY).toFixed(2);
       let distanceZ: number = (-(this.frontclickedY - originY) / originY).toFixed(2);

my browser throws an error when I calculated distanceZ:

Type 'string' is not assignable to type 'number'.

the first two lines work perfectly, but the third doesn't really work. As you can see it is even exact the same calculation as distanceY. I tried to parseFloat() it first. But then it starts to complain that I can only parse a string to a float, and that I didn't provide one.

I'm quite confused at the moment, so some help or a solution would be much appreciated!

Thanks in advance!

Edit: I tried to simplify my code. Made the distances private and added setters and getters.

private _distanceX: number;
private _distanceY: number;
private _distanceZ: number;

  get distanceZ(): number {
    return this._distanceZ;
}
set distanceZ(value: number) {
    this._distanceZ = value;
} ...
calculateBadgeDistance(): void{
        this.distanceX = (5.001).toFixed(2);
        this.distanceY = (5.001).toFixed(2);
        this.distanceZ = (5.001).toFixed(2);
}

Now I got the error on all 3 lines.

on which line does this occur? This snipped should work, if the variables are all numbers — Herr Derb, Oct 10 '16 at 11:22

score 30 · Accepted Answer · edited Oct 18 '19 at 16:24

30

The method toFixed() converts a number to a string. You have to parse the variables to numbers:

let distanceZ:number = parseFloat((-(this.frontclickedY - originY) / originY).toFixed(2));

Alternatively, temporarily store the string and parse it later

let distanceZTxt:string = (-(this.frontclickedY - originY) / originY).toFixed(2);
let distanceZ:number = parseFloat(distanceZTxt);

edited Oct 18 '19 at 16:24

John R Perry

3,916
2
38
62

answered Oct 10 '16 at 11:33

John

10,165
5
55
71

This worked for me now. But do you know why it worked for dinstanceX, distanceY but not for distanceZ? Thanks a lot for the fix :) – Yoran Cobben Oct 10 '16 at 12:28
Maybe you didn't define any type for `distanceY` and `distanceX` in the first place? If not, the variables will accept any data type. – John Oct 10 '16 at 12:29
I did, they are all private variables with setters and getters `private _distanceX: number;` `private _distanceY: number;` `private _distanceZ: number;` – Yoran Cobben Oct 10 '16 at 12:32
If they are all defined with the data type number, the error should occur on all variables unless you parse them from string to number. I see that with your updated code, you defined them as numbers, but are you sure they were numbers in your first attempt? Otherwise I am not sure. – John Oct 10 '16 at 12:38
Yes, I defined them in the function like this: `let distanceX, distanceY, distanceZ: number; ` – Yoran Cobben Oct 10 '16 at 13:03
I don't think the two first will receive a data type when you write it like that. `let distanceX:number, distanceY:number, distanceZ: number;` however will give them the number type – John Oct 10 '16 at 13:10
aha okay got it. Thanks a lot for the help :) – Yoran Cobben Oct 10 '16 at 13:20
Glad I could be of help ^^ Good luck! – John Oct 10 '16 at 13:24

score 0 · Answer 2 · answered Apr 06 '19 at 06:09

0

you can write your function like that to avoid this issue

get distanceZ(): number | string {
    return this._distanceZ;
 }

add "| string " with your function

answered Apr 06 '19 at 06:09

rajanbhadauria

445
4
11

score 0 · Answer 3 · answered Oct 24 '19 at 15:51

0

Try this

((this.frontclickedX  - originX) / originX).toFixed(2) as any

answered Oct 24 '19 at 15:51

naimjeem

657
6
7

Typescript, toFixed. Type 'string' is not assignable to type 'number'

3 Answers3