IE 11 - Background Color

Canvas Canvas Questions
1

Hi ,

On IE 11, the angular syntax of {{colorchoosen}} which is a variable refuse to work.

It works fine when I replace {{colorchoosed}} with black.

							<div class="col-xs-12 panel-heading text-sub-kpi" style="background-color:{{colorchoosen}}; padding:5px; margin:0px; color:#fff;">
								{{account.alias}}
							</div>
2

Hi @wlee,

How about if you paste it on the page (outside of the style)? Are you able to see the value “black”?

Also, with IE, try to inspect that element, and check to see if the value is there in the DOM.

–
Paul

3

Hi Paul,

Found the answer.

Style does not work on IE with angular.

Needs to be

ng-attr-style=“background-color:{{account.ColorGL}};color:white;padding:5px; margin:0px;”>

Sounds like it is not easy to make it compatible with IE 11.

1 Like
4

Hi @wlee,

You should be using the ng-style directive instead of string replacement or add a class with ng-class:

5

Hi @wlee,

Thanks for the update!

The preferred way to go about it will be through CSS class for reusability, and for easier customizations later on.

–
Paul

6

You could also use
data-ng-attr-style=" {{ account.ColorGL ? ‘background-color:’+account.ColorGL+‘’:‘background-color:#fff’}}"
ng-style does not work in IE 11

Ilia