Passing value to attribute in Angular

Question

I have an HTML element with the style attribute for inline CSS.

<div style="border-color:aqua!important">
...
</div>

I want to be able to pass values such that "aqua" would be changed via Angular 2 interpolation so I tried this...

<div style="border-color:{{item.color}}!important">
...
</div>

But this isn't working

Ali Baig · Accepted Answer · 2017-01-22 12:44:33Z

1

Try using

<div [style.border-color]="item.color">..</div>

answered Jan 22, 2017 at 12:09

Ali Baig

3,8674 gold badges36 silver badges49 bronze badges

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

2 Comments

I tried without the "!important" and value is getting passed when I inspect but I need the "!important" to override cascading

Rewrote CSS so !important wasn't neccessary. Thank you very much