2015-02-11 67 views
0

我正在使用離子創建一個移動應用程序。離子與angularjs圖像url不解析

我有一個項目列表,每個項目都有一張照片。

在我的每個項目的角模板,我有:

<img src='http://www.example.com/images/listings/{{listing.id}}/thumb.jpg'> 

我使用NG重複=「上市的列表」中顯示的模板。

我一直看到的角度,使一個調用非解析URL第一,但每一行得到正確的圖像,並將其顯示:那麼首先,它試圖讓

http://www.example.com/images/listings/{{listing.id}}/thumb.jpg 

不解析

{{上市。ID}}。

但隨後正確地解析並正確顯示圖像在列表中:

http://www.example.com/images/listings/3523/thumb.jpg 

所以,如果我具有15個項目的列表,它使一個呼叫非解析{{listing.id}}和15個調用正確解析。

我該如何阻止這種情況發生?

回答

2

您應該使用ngSrc而不是直接使用插值。

<img ng-src='http://www.example.com/images/listings/{{listing.id}}/thumb.jpg'>