我有以下内容:
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 }}
问题出在src =“holder.js / {{fragment.dimension.width}} x {{fragment.dimension.height}}”中,即使查看生成的html我看到了正确的src(src =“holder .js / 300×200“)它不显示图像.我猜这不是如何在属性中使用角度变量的.
我怎样才能使它工作?
编辑:
它似乎没有执行holder.js ..
这里是来源:在第一次调用中,我在第二次使用angular {{hash}},我手动将holder.js / 300×200
<div class="thumbnail"> <img src="holder.js/1678x638"> <img src="data:image/png;base64,iVBORw0KG...ElFTkSuQmCC" src="holder.js/300x200" alt="300x200" style="width: 300px; height: 200px;"> </div>
documentation很清楚地解释了这一点:
Using Angular markup like
@H_502_28@{{hash}}
in asrc
attribute doesn’t work right: The browser will fetch from the URL with the literal text{{hash}}
until Angular replaces the expression inside{{hash}}
. The ngSrc directive solves this problem.所以你必须使用:
<img ng-src="holder.js/{{fragment.dimension.width}}x{{fragment.dimension.height}}" />