CODEWITHSUNDEEP
javascriptangularjs
NewKidOnTheBlock
NewKidOnTheBlock

Reputation: 1511

using angular ng-style to call out a background image

I am having an with using the ng-style directive. I want to create add a button to my ng-repeat which is css sprite. If i include the sprite normal way my element inspector has a good old moan. from the information i gather from the Angular documentation

i thought it was as simple as the following:

<button ng-style="{'background-image':'url:('/img/Myimage.png')'}">test</button>

However i am receiving a snytax error message from this line of code. Does anyone know the correct method?

Upvotes: 1

Views: 1174

Answers (3)

NewKidOnTheBlock
NewKidOnTheBlock

Reputation: 1511

<button ng-style="{'background-image':'url(\'img/MyImage.png\')'}">test</button>

is the correct way to do it. was missing the escape the quotes in url 'url:(\'/img/Myimage.png\')'

Upvotes: 1

Denis
Denis

Reputation: 45

oh,{color:' something',background:'something '}

ng-style="{background:'url(something)'}"

or

ng-style="{'background-image':'url(something)'}"

Upvotes: 0

charlietfl
charlietfl

Reputation: 171669

Your CSS syntax is incorrect for url, you have extra : and I would remove quotes for the src so the whole property is one string

<button ng-style="{'background-image':'url(/img/Myimage.png)'}">test</button>

I really don't undertsand why you would use ng-style for this. A simple CSS rule and class would make more sense since you aren't evaluating anything

Upvotes: 0

Related Questions