Im trying to calc my div width on Angular NgStyle with 2 variables with different units

Question

I am trying to make a width: calc() but i want to make a substract of 2 variables with different units but it doesnt show expected output.

[ngStyle]="{ 'width': calc(notHedgedProgress + '%' - newPositionX + 'px') }"

NotHedgedProgress and NewPositionX are numbers

as you can see im trying to substract a '%' unit variable with a 'px' one.

Answer 1

Your variables has to be interpolated and the style rule must be in the form of a string:

[ngStyle]="{ 'width': 'calc(' + notHedgedProgress + '% - ' + newPositionX + 'px)' }"