Question

我有以下内容：

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/300x200"）也没有显示图像。我猜这不是人们如何在属性中使用角度变量。

我怎样才能让它发挥作用？

编辑：它似乎没有执行holder.js .. 这里是来源：在第一次调用中我在第二次使用angular {{hash}}时我手动放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>

Answer 1

documentation非常清楚地解释了：

在{{hash}}属性中使用src之类的Angular标记无法正常工作：浏览器将使用文字文本{{hash}}从URL中获取，直到Angular替换{{hash}}内的表达式1}}。 ngSrc指令解决了这个问题。

所以你必须使用：

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

在angularjs中使用src属性中的ng-repeat变量？

1 个答案: