4

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)

Mark Rajcok
  • 362,217
  • 114
  • 495
  • 492
MD. Jahidul Islam
  • 635
  • 5
  • 20
  • 1
    See a similar solution: [http://stackoverflow.com/questions/22046704/can-i-use-the-important-css-keyword-with-angularjs-ng-style-directive](http://stackoverflow.com/questions/22046704/can-i-use-the-important-css-keyword-with-angularjs-ng-style-directive) – G-Yo Feb 04 '16 at 02:29
  • @G-Yo thanks for the link, [attr.style]="'background-color:red !important'" worked for me. – MD. Jahidul Islam Feb 04 '16 at 02:40

1 Answers1

12

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.

MD. Jahidul Islam
  • 635
  • 5
  • 20