Question

我的模板中有一个漂亮的van-ng-repeat语句，用于重复表格中的一组图像：

<tr ng-repeat="d in data">
     <td><img src={{d.image}}></img></td>
</tr>

所有图像都正确加载（它们都存在并且它们都显示在表中）但是当我在本地测试时（以及我部署时），我在控制台中看到以下错误：

Failed to load resource: the server responded with a status of 404 (File not found) http://localhost:8000/%7B%7Bd.image%7D%7D

我认为这里发生的是在Angular加载之前抛出错误 - 这是有道理的，因为没有Angular，寻找{{d.image}}应该抛出错误 - 然后一次Angular加载，图像正确加载。

如果在加载Angular之前，如何让浏览器不尝试渲染{{d.image}}？我将ng-cloak放入<body>标记，但这似乎并没有帮助。我是否正在考虑这个正确的方法？

Answer 1

当您使用src属性插入图片路径时，会出现此问题。使用 ng-src ，而不是使用src属性。

<tr ng-repeat="d in data">
     <td><img ng-src="{{d.image}}"></td>
</tr>