If I do something like this:
<div style="margin-left: 50px;">TEST1</div>
<div style="margin-left: {{50}}px;">TEST2</div>
The margin-left of the value test2 will not be applied, and this only in IE, any suggestion for a work around this?
Add a comment
|
3 Answers
As a workaround you could use ng-style:
<div ng-style="{ 'margin-left': 50 + 'px'}">TEST2 {{50}}</div>
Fiddle: http://jsfiddle.net/YXe8Z/
Comments
About the bug, it's strange that only IE behaves this way.
Anyway, you could ng-style directive for this purpose - because if you're going to wait until Angular parse that interpolation and correctly apply the style, it's better to do it with proper directives :)
<div ng-style="{ 'margin-left': 50 + 'px' }">TEST2</div>
1 Comment
Jerome Ansia
Thank you Gustavo but Jason was a bit faster than you on this ;)
ng-style vs style
Just a quick tip – use ‘ ‘ for defining a property in ng-style. Eg use ‘margin-left’ in place of margin-left, as it works fine if only one word property like width. width, top, left… doesn’t required to be ‘width’, ‘top’, ‘left’ but for good practice use ‘width’.
