1

I have a ngFor loop that iterates over an object (selectedUser). I'm trying to use a value from this property inside 'background-image' style rule, but i keep getting parsing errors.

<div *ngFor="let user of selectedUser.user">
 <div class="user-img" ngStyle="{'background-image':'url(/assets/img/{{ user.image }})'}" alt="">
 </div>
</div>

Any idea what the correct syntax for something like this would be?

Kode_12
  • 4,506
  • 11
  • 47
  • 97
  • you need not use `{{ }}` there, `ngStyle="{'background-image':'url(/assets/img/' +user.image +')'}"` should work. – prady Jun 11 '18 at 04:14
  • 1
    also this question is already answered [here](https://stackoverflow.com/questions/31145558/dynamic-refresh-background-image-with-ngstyle-in-angularjs?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa), so please mark this duplicate. – prady Jun 11 '18 at 04:17

2 Answers2

1

Just remove the annotation {{}}

 <div class="user-img" ngStyle="{'background-image':'url(/assets/img/' +user.image +')'}" alt="">

Sajeetharan
  • 216,225
  • 63
  • 350
  • 396
0

Try to use like below

<div *ngFor="let user of selectedUser.user">
 <div class="user-img" ngStyle="{'background-image':'url(/assets/img/'+ {{ user.image }} + ')'}" alt="">
 </div>
</div>
Arash
  • 1,692
  • 5
  • 21
  • 36