如何从 html 中的 AngularJS 控制器中评估变量

Question

我想根据 libro.isAvailable 的值显示不同的图像

<tr ng-repeat="libro in misLibros">
     <td>{{libro.titulo}}</td>
     <td>{{libro.autor}}</td>
     <td id="isAvailable"></td>
     <SCRIPT>
     if(libro.isAvailable== true) {
         document.getElementById("isAvailable").innerHTML = "<img src="../resources/v.png" style="width: 1.5em;">"                                        }
     else{
         document.getElementById("isAvailable").innerHTML = "<img src="../resources/x.png" style="width: 1.5em;">"
        }
    </SCRIPT>
 </tr>

但是当我加载页面时，chrome 控制台显示：配置文件页.html：102 未捕获的引用错误：未定义 libro

其他字段显示正确。如何使用脚本内部的变量？或者还有另一种方法可以做到这一点？

Answer 1

angular 的优点之一是在大多数情况下，您不需要通过 javascript 访问 DOM。

话虽如此，请使用ng-if

<tr ng-repeat="libro in misLibros">
     <td>{{libro.titulo}}</td>
     <td>{{libro.autor}}</td>
     <td id="isAvailable" ng-if="libro.isAvailable"><img src="../resources/v.png" style="width: 1.5em;"></td>
     <td id="isAvailable" ng-if="!libro.isAvailable"><img src="../resources/x.png" style="width: 1.5em;"></td>
</tr>