When I try to fetch a group of images through AJAX and exhibit them on the page using ng-repeat, an issue arises with the image source tags. These tags send incorrect requests to the server before the collection is retrieved, leading to error messages in the log files.
<li data-ng-repeat="submission in submissions">
<a href="/entry/{{submission.slug}}" class="submission-thumb">
<img src="{{submission.thumbnail_url}}">
</a>
<a href="/entry/{{submission.slug}}" class="submitter-avatar">
<img src="{{submission.profile_picture_url}}" width="42"/>
</a>
</li>
Requests such as
GET http://localhost:9000/campaign/%7B%7Bsubmission.profile_picture_url%7D%7D 404 (Not Found)
can be problematic. Is there a way to prevent this from happening? Thank you!