knockout.js - 如何在 div 表中显示错误消息？

Question

我正在使用淘汰赛 ko 绑定生成动态表（员工详细信息），如下所示例如：

如果 EmpDetails 为空，那么我想在 div 中显示错误消息“No Data”。我使用了敲除可见绑定来显示错误消息。

目前我正在单行显示

员工详细信息：
无数据

预期：适合 5 行空间中的“无数据”消息。

参考以下代码：

<div class="empSection" data-bind="visible:displayData">
        <span>Employee Details:</span>
        <table class="empTable" border="0">
            <thead>
                <tr>
                    <th class="empTableHeader">NAME</th>
                    <th class="empTableHeader">EMPNO</th>
                    <th class="empTableHeader">DEPT</th>
                </tr>
            </thead>
            <tbody data-bind="foreach: EmpDetails">
                <tr>
                    <td class="empName" data-bind="text: Name"></td>
                    <td class="empNo" data-bind="text: emono"></td>
                    <td class="empDept" data-bind="text: dept"></td>
                </tr>
            </tbody>
        </table>

</div>

<div class="empSection" data-bind="visible:ErrorMsg, text:"No Data">

请问这方面有什么建议吗？？

提前致谢。

Answer 1

只需取反 displayData 值并设置填充或高度以填充等于 5 行高的空间：

<div class="empSection" style="padding: 50px 0; text-align: center;" data-bind="visible:!displayData()">
  No data
</div>