使用 ng-if 和 ng-repeat 在 table 内显示图像

Question

我想问你一个问题。我的愿望是创建一个由 4 列组成的 table，并在变量（blocco1 或 blocco2）为真时在 table-数据（每行的第 3 和第 4 列）上显示绿色圆圈图像，并且相同变量为假时的红色圆圈图像。

这是我的代码

                        <tr ng-repeat="data in elencoTransazioni">
                            <td class="i9fontPre text-center" header-class="'i9header'">{{::data.code}}</td>
                            <td class="i9fontPre text-center" header-class="'i9header'">{{::data.desc}}</td>    
                            <td class="i9fontPre text-center" header-class="'i9header'">
                                <img ng-if="data.blocco1=='true'" src="/i9web/mock/circleGreen.png">
                                <img ng-if="data.blocco1=='false'" src="/i9web/mock/circleRed.png">
                            </td>
                            <td class="i9fontPre text-center" header-class="'i9header'">
                                <img ng-if="data.blocco2=='true'" src="/i9web/mock/circleGreen.png">
                                <img ng-if="data.blocco2=='false'" src="/i9web/mock/circleRed.png">
                            </td>
                        </tr>

谁能帮帮我？

提前致谢

Answer 1

尝试使用 ng-src.

<tr ng-repeat="data in elencoTransazioni">
  <td class="i9fontPre text-center" header-class="'i9header'">{{::data.code}}</td>
  <td class="i9fontPre text-center" header-class="'i9header'">{{::data.desc}}</td>
  <td class="i9fontPre text-center" header-class="'i9header'">
    <img ng-src="{{data.blocco2 ? '/i9web/mock/circleGreen.png'
                               :'/i9web/mock/circleRed.png'}}">
  </td> 
</tr>

使用 ng-if 和 ng-repeat 在 table 内显示图像

Show an image inside table with ng-if and ng-repeat

angularjs

angularjs-ng-repeat

angular-ui-bootstrap

angular-ng-if