CODEWITHSUNDEEP
angularjspug
0xmtn
0xmtn

Reputation: 2670

Jade expression to render image from url sends another request to the server

I have a jade file, where I parse the user data and construct the page. There is a place in this file where I loop through the users' images and render them to the page:

.picture-item(ng-repeat='m in userProfile.media')
  img.picture(src='{{m.mediaUrl}}')

But the problem is, even though this line of code shows the image on the page, it send another request to server like below:

http://localhost:3000/%7B%7Bm.mediaUrl%7D%7D

This happens on: http://localhost:3000/profile page. If I go to a user's profile, let's say: http://localhost:3000/profile/some_username, then the code above sends a request like: 

http://localhost:3000/profile/%7B%7Bm.mediaUrl%7D%7D

m.mediaUrl are user's instagram image urls.

What could be the problem here? Any ideas?

Thanks in advance.

Upvotes: 0

Views: 308

Answers (1)

Sebastian
Sebastian

Reputation: 8005

You are running into a known issue with AngularJS client side late binding.

You can use another attribute for the img tag instead:

https://docs.angularjs.org/api/ng/directive/ngSrc

   .picture-item(ng-repeat='m in userProfile.media')
     img.picture(ngSrc='{{m.mediaUrl}}')

Upvotes: 1

Related Questions