KnockoutJS:当返回的数组为空时显示消息

KnockoutJS: Show message when the returned array is empty

本文关键字：显示 消息 数组 返回 KnockoutJS      更新时间：2023-09-26

我想显示一条消息，以防返回的任务数组为空。我用了这个：

<span data-bind="visible: tasksArr().length == 0">
   There are no tasks yet.
</span>

但它不能正常工作。当我加载页面时，消息在内容加载到数组之前会显示一秒钟，因为tasksArr是在请求完成获取内容之前声明的。有没有更简单的方法让它在加载完成后显示，而无需诉诸额外的可观察量？

正如你在这个小提琴中看到的，obervableArray的默认值是一个空数组。因此，未初始化的 obervableArray 和空的 obervableArray 之间没有区别。

有2个工作轮次：

声明更多可观察量： 

function vm() {
    var self = this;
    self.tasksArr = ko.observableArray([]);
    self.initilized = ko.observable(false);
    self.canSee = ko.computed(function(){
       var a = self.tasksArr().length;
       return self.initilized() && a;
    }); 
    self.load = function () {
        setTimeout(function () {
            for (var i = 0; i < 100; i++) {
                self.tasksArr.push(i);
            }
            self.initilized(true);
        }, 1000);
    }();
}
ko.applyBindings(new vm());

见小提琴

您也可以延迟绑定

function vm() {
    var self = this;
    self.tasksArr = ko.observableArray();
    self.load = function () {
        setTimeout(function () {
            /*for (var i = 0; i < 100; i++) {
                self.tasksArr.push(i);
            }*/
            ko.applyBindings(x);
        }, 1000);
    }();
}
var x = new vm();

见小提琴

我希望它有所帮助。

默认隐藏范围（display：none;）。这样，消息将在页面加载时隐藏，并且仅在任务Arr确实为空时才可见。

相关文章：