在加載AngularJS之前嘗試檢索數據的Web應用程序

Question

我正在將圖像添加到div，ng-repeat正常工作。圖像位置數據嵌套在一個數組中。圖像按預期顯示。我的部分看起來像：

<div class="image-wrapper"> 
    <img src={{item.user.img_src}}> 
</div> 

但是，出現的頁面是試圖加載AngularJS之前檢索的字符串。我收到以下控制檯警告：

GET http://localhost:3000/%7B%7Bitem.user.img_src%7D%7D 404 (Not Found) 

如何防止此問題？

Answer 1

src屬性是越野車在使用角的標記。使用ngSrc而不是src。

因此，<img ng-src="{{item.user.img_src}}">

Answer 2

當瀏覽器第一次加載頁面時，它看到了你的src，就像你寫的那樣。直到Angular負載並處理它更新動態數據源的頁面。這些都不是你想要發生的事情（尤其是因爲你可能會意外地創建壞的空src屬性）。相反，使用ngSrc指令，所以沒有SRC將被設置直到角度評估了你的表達：

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