1
 <div ng-click="uploadwall($event)"
      ng-style="{{ wall.pic && {'background-image':'data:image/jpeg;base64,wall.pic'} || {'background-image': 'url(img/wall-bg.jpg)'} }}">

</div>

the wall.pic is from controller $scope.wall. The Problem is wall.pic is not rendering data.

2 Answers 2

2

It should be:

ng-style="wall.pic && {'background-image':'url(data:image/jpeg;base64,' + wall.pic + ')'} || {'background-image': 'url(img/wall-bg.jpg)'}"

Without the {{ }} and you are missing the url() part

And btw I don't know what wall.pic is but if it is an URL/Path it should be:

ng-style="wall.pic && {'background-image': 'url(' + wall.pic + ')'} || {'background-image': 'url(img/wall-bg.jpg)'}"

JSFiddle

Sign up to request clarification or add additional context in comments.

5 Comments

I have tried this too, same problem image is not coming
Answer updated there is an error change 'data:image/jpeg;base64,wall.pic' with 'data:image/jpeg;base64,'+wall.pic
it's a base64 image fetching from firebase
So you are still missing the url() it should be 'url(data:image/jpeg;base64,'+wall.pic+')'
yes right, I've tried that and solved my problem, but still when data is from firebase databse it is not binding in background-image.
1

Try like this

 ng-style="{'background-image' : wall.pic ? 'data:image/jpeg;base64,wall.pic' :  'url(img/wall-bg.jpg)' }"

4 Comments

could not get background-image.
what's the issue ? it's not showing or it's not setting ? @user3252143
it's perfect setting but background-image is not coming.
may be your path or your data:image/jpeg;base64,wall.pic is not correct @user3252143

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.