Question

当我想通过AJAX提取图像集合并使用ng-repeat在页面中显示时。

<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>

问题在于上面的上述图像源标签。在收集数据之前，它会不断向服务器发送以下无效请求，并在日志文件中生成错误消息。

GET http://localhost:9000/campaign/%7B%7Bsubmission.profile_picture_url%7D%7D 404 (Not Found) test:138
GET http://localhost:9000/campaign/%7B%7Bsubmission.thumbnail_url%7D%7D 404 (Not Found)

无论如何要防止这种情况发生？谢谢！

Answer 1

使用ng值可以防止这种情况发生：

<a ng-href="/entry/{{submission.slug}}" class="submission-thumb">
    <img ng-src="{{submission.thumbnail_url}}">
</a>

另外，我不会那样使用width：

<img src="{{submission.profile_picture_url}}" width="42"/>

最好使用CSS（通过课程更好）：

<img src="{{submission.profile_picture_url}}" style="width:42px;" />

来源：AngularJS: ng

当资源不可用时，AngularJS会一直发送无效请求

1 个答案: