asp.net-mvc – 当可观察数组为空时如何显示无数据？

发布时间：2020-12-16 04:32:48 所属栏目：asp.Net 来源：网络整理

导读：我是Knockout.js的新手,我正在尝试将可观察数组中的数据显示到表中. 我遇到的问题是它会生成两个tbody标签.但是如果我将空检查逻辑移动到foreach：循环中,No Data就会显示出来. 使用表格有更好的方法吗？在这种情况下,我不喜欢使用ul或ol. table thead tr th

我是Knockout.js的新手,我正在尝试将可观察数组中的数据显示到表中.
我遇到的问题是它会生成两个tbody标签.但是如果我将空检查逻辑移动到foreach：循环中,No Data就会显示出来.

使用表格有更好的方法吗？在这种情况下,我不喜欢使用ul或ol.

<table>
    <thead>
        <tr>
            <th>Permit</th>
            <th>Region</th>
            <th>Landowner</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: requestList">
        <tr>
            <td><span data-bind="text: permit"></span></td>
            <td><span data-bind="text: region"></span></td>
            <td><span data-bind="text: landowner"></span></td>
        </tr>
    </tbody>
    <tbody data-bind="if: requestList().length === 0">
        <tr>
            <td colspan="3">No Data</td>
        </tr>
    </tbody>
</table>

解决方法

在这样做时,我们大量使用虚拟元素.它们在这里概述了 http://knockoutjs.com/documentation/if-binding.html#note_using_if_without_a_container_element

你的标记的其余部分很好,但你可以将你的第一个tbody包装在这样的虚拟元素中：

<!-- ko if: requestList().length -->
    <tbody data-bind="foreach: requestList">
        <tr>
            <td><span data-bind="text: permit"></span></td>
            <td><span data-bind="text: region"></span></td>
            <td><span data-bind="text: landowner"></span></td>
            <td><button data-bind="click: $parent.remove">Remove</button></td>
        </tr>
    </tbody>
<!-- /ko -->

JSFiddle这里：http://jsfiddle.net/ZKWMh/

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!