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
– Herr Derb, Commented Oct 10, 2016 at 11:22

John R Perry · Accepted Answer · 2019-10-18 16:24:58Z

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, 2019 at 16:24

John R Perry

4,2222 gold badges45 silver badges70 bronze badges

answered Oct 10, 2016 at 11:33

John

11.6k5 gold badges60 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Yoran Cobben Over a year ago

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 :)

John Over a year ago

Maybe you didn't define any type for distanceY and distanceX in the first place? If not, the variables will accept any data type.

Yoran Cobben Over a year ago

I did, they are all private variables with setters and getters private _distanceX: number; private _distanceY: number; private _distanceZ: number;

John Over a year ago

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.

Yoran Cobben Over a year ago

Yes, I defined them in the function like this: let distanceX, distanceY, distanceZ: number;

|

rajanbhadauria · Accepted Answer · 2019-04-06 06:09:43Z

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 6, 2019 at 6:09

rajanbhadauria

4434 silver badges11 bronze badges

Comments

naimjeem · Accepted Answer · 2019-10-24 15:51:53Z

0

Try this

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

answered Oct 24, 2019 at 15:51

naimjeem

8877 silver badges8 bronze badges

Collectives™ on Stack Overflow

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

3 Answers 3

8 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

8 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related