如何不显示任何数据时，可观察到的数组为空？(How to display No Data when

我是新来Knockout.js，我试图从观察到的阵列数据显示到一个table 。我的问题是，它产生两个tbody标签。但是，如果我移动空检查逻辑到foreach:循环中， No Data不showup可言。

有没有更好的方式来做到这一点使用表？我不喜欢用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>

Answer 1:

如果这样做，我们做了很多使用虚拟元素的。他们在这里列出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/

Answer 2:

其实，你的HTML标记的罚款。我添加下面的JavaScript到您的标记

$(document).ready(function() {
    var a = [{
        permit: "permit1",
        region: 'region1',
        landowner: 'landowner'},
    {
        permit: "permit2",
        region: 'region2',
        landowner: 'landowner2'}];
    var vm = {};
    vm.requestList = ko.observableArray([]);

    ko.applyBindings(vm);

    $('#loadData').click(function() {
        var a1 = ko.mapping.fromJS(a);
        var b1 = a1();
        vm.requestList(b1);
    });
});

它似乎是工作，你描述你对想要的东西的工作。这是工作在http://jsfiddle.net/photo_tom/xmk3P/10/

文章来源: How to display No Data when observable array is empty?