Knockout.js-基于表值显示图像

Knockout.js-基于表值显示图像,knockout.js,Knockout.js,我有一张有9列的桌子。我希望能够使用knockoutjs显示三个图像中的一个,这取决于特定列是否为null。下面的代码显示了我最新的atempt,但是它将所有3个图像都放在单元格中,好像所有图像都返回true <tbody data-bind="foreach:xrefs"> <tr> <td> @*<img data-bind="if: API14 == null || PROP_NM == nul

我有一张有9列的桌子。我希望能够使用knockoutjs显示三个图像中的一个,这取决于特定列是否为null。下面的代码显示了我最新的atempt,但是它将所有3个图像都放在单元格中,好像所有图像都返回true

<tbody data-bind="foreach:xrefs">
    <tr>

        <td>


            @*<img data-bind="if: API14 == null || PROP_NM == null || PROD_ZONE_NM == null || LEASE_NAME == null || WELL_NO == null" src="~/img/warning_25.png" />
            <img data-bind="if: PROP_NO == null || ENTITY == null" src="~/img/error-25.png"/>
            <img data-bind="ifnot: PROP_NO == null || ENTITY == null || API14 == null || PROP_NM == null || PROD_ZONE_NM == null || LEASE_NAME == null || WELL_NO == null " src="~/img/green_Chk_25.png" />*@
        </td>



        <td data-bind="text:API14"></td>
        <td data-bind="text:PROP_NO"></td>
        <td data-bind="text:PROP_NM"></td>
        <td data-bind="text:ENTITY"></td>
        <td data-bind="text:PROD_ZONE_NM"></td>
        <td data-bind="text:LEASE_NAME"></td>
        <td data-bind="text:WELL_NO"></td>
        <td class="text-nowrap">
            <a data-bind="attr:{href:'@Url.Action("Details")/'+id}" class="btn btn-info">Details</a>
            <a data-bind="attr:{href:'@Url.Action("Edit")/'+id}" class="btn btn-primary">Edit</a>
            <a data-bind="attr:{href:'@Url.Action("Delete")/'+id}" class="btn btn-danger">Delete</a>
        </td>
    </tr>
</tbody>

@*
*@

if绑定仅显示/隐藏应用绑定的元素的内容。要使IMG元素消失,您必须将每个元素包装在一个包含元素中,或者使用knockout虚拟元素进行绑定

<td>      
    <!-- ko if: API14 == null || PROP_NM == null || PROD_ZONE_NM == null || LEASE_NAME == null || WELL_NO == null -->
        <img src="~/img/warning_25.png" />
    <!-- /ko -->
    ...
</td>

...