Stanley Xuan Luo Stanley Xuan Luo - 4 months ago 10
AngularJS Question

Unwanted GET request in ng-repeat

I'm making a simple Angular Flickr Photo Feeder:
Codepen link

After searching for some tag, there is a list of returned

img-container
items displayed by ng-repeat. And at the very beginning, there should be no item in the list, thus there should be no
img-container
element.

However when starting the app, in the console it shows a 404 error (can't get
photo.media.m
,which is the
src
attribute of
img
element). This means there is at least one
img-container
element in the beginning.

Any thoughts, and how to prevent this error?

Answer

Use ng-src insetad of src. That way you won't get an error.

<img class="img-responsive" ng-src="{{photo.media.m}}">

From the official AngularJS documentation:

Using Angular markup like {{hash}} in a src attribute doesn't work right: The browser will fetch from the URL with the literal text {{hash}} until Angular replaces the expression inside {{hash}}. The ngSrc directive solves this problem.