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.

Improve this question

2 Answers 2

Reset to default
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

Improve this answer
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)' }"
Improve this answer

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

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.