Menu
If I do something like this:
<div style="margin-left: 50px;">TEST1</div>
<div style="margin-left: {{50}}px;">TEST2</div>
http://jsfiddle.net/XeVHL/1/
The margin-left of the value test2 will not be applied, and this only in IE, any suggestion for a work around this?
835
Use style binding to set styles dynamically. Binding to a single style link To create a single style binding, use the prefix style followed by a dot and the name of the CSS style property—for example, [style.width]="width". Angular sets the property to the value of the bound expression, which is usually a string.
Style Binding in Angular. Style binding is used to set a style of a view element. We can set inline styles with style binding. Like with class and attribute binding, style binding syntax is like property binding. In property binding, we only specify the element between brackets.
To ensure your AngularJS application works on IE please consider: Use ng-style tags instead of style="{{ someCss }}". The latter works in Chrome, Firefox, Safari and Edge but does not work in Internet Explorer (even 11). For the type attribute of buttons, use ng-attr-type tags instead of type="{{ someExpression }}".
Refer to a template variable anywhere in the component's template. Here, a <button> further down the template refers to the phone variable. Angular assigns a template variable a value based on where you declare the variable: If you declare the variable on a component, the variable refers to the component instance.
As a workaround you could use ng-style:
<div ng-style="{ 'margin-left': 50 + 'px'}">TEST2 {{50}}</div>
Fiddle: http://jsfiddle.net/YXe8Z/
167
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>
http://jsfiddle.net/q4UKD/
29
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
