CODEWITHSUNDEEP
angularangular8
Atif Azad
Atif Azad

Reputation: 737

how to add Dynamic Conditional Background Images in angular 8

I am new to Angular (8). I am trying to add background image with condition. Please help me to sort it out. following is my code.

<div class="kt-avatar__holder"
[ngStyle]="{'background-image': if addUser.value.attachmentURL? {{addTDAUser.value.userImage}} else'../assets/media/users/300_20.jpg'}">
  
Content

</div>

Upvotes: 3

Views: 2087

Answers (2)

Tayyab Roy
Tayyab Roy

Reputation: 513

<div class="event-thumbnail"
    [ngStyle]="{'background-image': item.logoURL ? 'url(' + item.logoURL + ')' : 'url(' + 'assets/img/default/event-1.png' + ')' }">

Upvotes: 2

Mridul
Mridul

Reputation: 1366

You can use [ngStyle] like this

<div class="kt-avatar__holder" style="height: 200px; width: 200px;"
        [ngStyle]="{'background-image': addUser.value.attachmentURL ? 'url(' + addTDAUser.value.userImage + ')' : 'url(' + '../assets/media/users/300_20.jpg' + ')' }">
       Content
</div>

Upvotes: 4

Related Questions