CODEWITHSUNDEEP
cssangular
Yang Rui
Yang Rui

Reputation: 251

In angular , How to use component variable in style

I want to use a variable width in my angular 5 component template, just like this:

<style>
    input:checked + .slider:before {
        transform: translateX({{width}}px);
    }
</style>

While 'width' is a variable defined in component!

however the "{{width}}" is not parsed ,how to implement this function.thanks!

Upvotes: 3

Views: 8234

Answers (1)

Mohammad Kermani
Mohammad Kermani

Reputation: 5416

You can use Angular ngStyle in this case:

[ngStyle]="{ width: width }"

Take a look at this demo

Upvotes: 3

Related Questions