Ember.js - image in content property is outputting wrong

0
votes

I have a bunch of data that gets stored in my controller s content property. Specific to this problem, I have an image URL as a value nested in an image object.

eg:

content:

  • [stuff] (array)

    • {image} (object)

      -- thumbNail : http:imageURL.com/image.jpg

When I either log out the property or look at it with the Ember inspector everything is correct.

However, when I display the data on my page with:

<img src="{{thumb}}>

I get something like this:

%3Cscript%20id='metamorph-191-start'%20type='text/x-placeholder'%3E%3C/script%3Ehttp://imageURL.com/image.jpg%3Cscript%20id='metamorph-191-end'%20type='text/x-placeholder'%3E%3C/script%3E

So it looks like Ember is throwing script tags around the image URL and causing everything to die horribly. I do the same operation at other places and dont have any problems.

Ideas?

1
javascriptjqueryember.js

1 Answers

0
votes

Figured it out (actually my coworker has dealt with this before). The issue is how Ember binds properties. Its expecting the property to change so it spits out the script data at the front and end. Normally an awesome thing, but in this case it sucks because this is a URL.

So to fix it I just did:

<img {{bind-attr src=thumb}}>