2013-08-01 14 views
6

Ben şu var:Angularjs içinde ng-repeat değişkenini src özniteliğinde mi kullanıyorsunuz?

div.container 
    script(src='/js/bootstrap/holder.js') 
    p.text-info(ng-pluralize, 
       count="devices.length", 
       when="{ '0': 'There are no fragments.', 'one': 'There is 1 fragment.', 'other': 'There are {} fragments.'}") 

    ul.unstyled(ng-repeat='fragment in devices') 
     ul.thumbnails 
      li.span 
       div.thumbnail 
        img(src="holder.js/{{fragment.dimension.width}}x{{fragment.dimension.height}}") 
        div.caption 
         h3 {{fragment.name}} 
         p {{fragment.dimension}} 
         ul.unstyled(ng-repeat='component in fragment.components') 
          li {{ component.name }} 

sorun src="holder.js/{{fragment.dimension.width}}x{{fragment.dimension.height}}" içindedir, yani bile görüntüyü göstermiyor ben doğru src (src="holder.js/300x200") bakınız çıkan html bakarak eğer. Benim tahminim bu, öznitelikler içindeki açısal değişkenleri nasıl kullanacağı değil ..

Nasıl çalıştırabilirim?

DÜZENLEME: o burada holder.js .. yürütmüyor görünüyor kaynağıdır: Ben kullanılan ilk aramada açısal {{hash}} saniyede el holder.js/300x200

<div class="thumbnail"> 
    <img src="holder.js/1678x638"> 
    <img src="data:image/png;base64,iVBORw0KG...ElFTkSuQmCC" data-src="holder.js/300x200" alt="300x200" style="width: 300px; height: 200px;"> 
</div> 

cevap

9

documentation koymak bir src Özellikte {{hash}} gibi Açısal işaretlemeyi kullanma

doğru çalışmıyor: oldukça net açıklar tarayıcı değişmez metin 012 ile URL'den alıp bunuAçısala kadar ifade {{hash}} içinde değiştirir. NgSrc yönergesi bu sorunu çözmektedir.

Yani kullanmalısınız: O çalışmıyor

<img ng-src="holder.js/{{fragment.dimension.width}}x{{fragment.dimension.height}}" /> 
+0

, kodda ben görüntüleyebilmelerinin: '' – fusio

+0

bir [jsFiddle] (http oluşturun: // jsfiddle. net) sorunu yeniden üretebilir. – Blackhole

+0

Uhmm .. yeşim olmadan, çalışıyor gibi görünüyor .. yeşim açıyla çelişkili olabilir mi? http://jsfiddle.net/vXA8b/2/ (jsfiddle'da yeşim ve açısal işlerin nasıl yapıldığından emin değil) – fusio

İlgili konular