# Set background-image with condition (if... else)

**URL:** <https://forum.ionicframework.com/t/set-background-image-with-condition-if-else/56102>\
**Category:** ionic-v3\
**Created:** [June 28, 2016, 9:28pm UTC](https://forum.ionicframework.com/t/set-background-image-with-condition-if-else/56102 "2016-06-28T21:28:42Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Dieyy](https://avatars.discourse-cdn.com/v4/letter/d/4bbf92/32.png) [@Dieyy](https://forum.ionicframework.com/u/Dieyy)\
**Post date:** [June 28, 2016, 9:28pm UTC](https://forum.ionicframework.com/t/set-background-image-with-condition-if-else/56102/1 "2016-06-28T21:28:42Z")

</div>

Hello,

How do I set css background-image with condition?

if value exist, show this image. like this?

`<div [ngStyle]="{'background-image': 'url(' + value ? image : otherImage + ')'}"></div>`

but it’s not working. Can anyone elaborate this? thanks.

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [June 28, 2016, 9:40pm UTC](https://forum.ionicframework.com/t/set-background-image-with-condition-if-else/56102/2 "2016-06-28T21:40:35Z")

</div>

Perhaps you are running into the DOM sanitizer mentioned in [the angular rc2 changelog](https://github.com/angular/angular/blob/master/CHANGELOG.md). If it’s possible to do so, the simplest and safest way to handle this would be to define your two background images in CSS as class selectors, and then do the dynamic bit by twiddling classes on the `div`.

---

<div class="post-metadata">

**Author:** ![Dieyy](https://avatars.discourse-cdn.com/v4/letter/d/4bbf92/32.png) [@Dieyy](https://forum.ionicframework.com/u/Dieyy)\
**Post date:** [June 28, 2016, 10:34pm UTC](https://forum.ionicframework.com/t/set-background-image-with-condition-if-else/56102/3 "2016-06-28T22:34:16Z")

</div>

Thanks for your response.

What if it is a dynamic image which is come from JSON object? Each element will have a different image.

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [June 28, 2016, 10:35pm UTC](https://forum.ionicframework.com/t/set-background-image-with-condition-if-else/56102/4 "2016-06-28T22:35:28Z")

</div>

Then you will probably have to futz around with the DOM sanitizer. See the changelog in my previous comment.