Inline css with ngFor

Hi,

I am trying to set a backgroundColor of boxes according to an Array. When I try to set inline backgroundcolor I get
ng-reflect-style="unsafe"
as inline style on the div. Is there any way to do this? ng-style?

<div class='square-grid'>
	<div class='square-grid__cell square-grid__cell--6' *ngFor="let color of colorsArray">
		<div class='square-grid__content' style="background-color: {{color}}">
			{{color}}
		</div>
	</div>
</div>

this.colorsArray =["#abc123", "#af5123", "#bde156", "#fff", "#000", "#eee", "#abc123", "#af5123", "#bde156", "#fff", "#000", "#eee", "#abc123", "#af5123", "#bde156", "#fff", "#000", "#eee"];

[ngStyle]="{‘backgroundColor’: color}" fixed it

1 Like