所以我有一个列表，其中有一列包含 bool 值，以防某些项目有附件，当它确实有附件时，它会显示一个“剪辑”图标。我想对 AngularJS 表做同样的事情:
这是我的代码，HTML:
请注意，{{link.Attachments}}
<body ng-app="myApp">
<div ng-controller="myController">
<table>
<thead>
<tr>
<th>Attachments</th>
<th>Name</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="link in links">
<td>{{link.Attachments | booleanFilter}}</td>
<td>{{link.Name}}</td>
<td>{{link.Date | date:"MM/dd/yyyy"}}</td>
</tr>
</tbody>
</table>
</div>
</body>
这是我的过滤器脚本:
我想在有附件(为真)时显示附件图片，为假时不显示任何内容:
var myApp = angular
.module('myApp', [])
.filter('booleanFilter', function() {
return function(booleanFilter) {
switch(booleanFilter) {
case true:
return "clip.png";
case false:
return "";
}
}
})
这段代码的缺点是它将“clip.png”显示为字符串而不是显示图标图片，我也尝试放置一个 Material Icon 的代码:
<i class="material-icons">attach_file</i>
但它行不通...那么有什么想法或者我做错了什么吗？
最佳答案
如果您的标志是可以具有真值或假值的附件，那么您甚至不需要过滤器:
<tbody>
<tr ng-repeat="link in links">
<td><i ng-if="link.Attachments" class="material-icons">attach_file</i></td>
<td>{{link.Name}}</td>
<td>{{link.Date | date:"MM/dd/yyyy"}}</td>
</tr>
</tbody>
关于javascript - 当 AngularJS 的 bool 值为 TRUE 时显示图像(或图标)？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48141182/