ngStyle does not work with !important in angular2

Question

In angular2 template if I write:

[ngStyle]="{'background-color': 'red'}"

it works as expected. But If I write:

[ngStyle]="{'background-color': 'red !important'}"

it's not working (not showing any error also)

Answer 1

As angular2 documentation is still not good enough, I think it may be helpful to post the solution as an answer (may be it helps someone).

According to angularjs (1.x) git repository issue

You're not able to use the !important directive in the DOM style property in either Chrome nor FF (probably others too)

So instead of using !important in [ngStyle] I use the following way to make it work:

[attr.style]="'background-color:red !important'"

It works as expected.