Search code examples
angularjsng-style

Convert style attribute to ng-style

I have following style in an angularjs application, which is working fine. Can this be replaced by ng-style, or its better to stick to the style attribute as I have it now?

style="border-bottom:solid {{command.name == 'Delete' ? '1px':'0px'}} lightgray;
                      padding-bottom:{{command.name == 'Delete' ? '10px':'0px'}};

The ng-style code that I tried but which didn't work.

ng-style="{border-bottom:solid {{command.name == 'Delete' ? '1px':'0px'}} lightgray;
                   padding-bottom:{{command.name == 'Delete' ? '10px':'0px'}}; }"
Solution

  • That's because it takes an object, no need to do {{}} in there:

    ng-style="{
    borderBottom: 'solid ' + (command.name == 'Delete' ? '1px':'0px') + ' lightgray',
    paddingBottom: (command.name == 'Delete' ? '10px':'0px')
}"