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

时间:2013-09-17 08:18:55

标签: javascript knockout.js

如果返回的任务数组为空,我想显示一条消息。我用过这个:

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

但它无法正常工作。当我加载页面时,在将内容加载到数组之前,消息会显示一秒,因为在请求完成获取内容之前声明了tasksArr。是否有一种更简单的方法可以在加载完成后显示它而不需要额外的可观察值?

2 个答案:

答案 0 :(得分:0)

正如您在this fiddle中所看到的,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());

See fiddle

您还可以延迟绑定

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();

See fiddle

我希望它有所帮助。

答案 1 :(得分:-1)

默认隐藏范围(display:none;)。这样,Message将在页面加载时隐藏,只有在tasksArr确实为空时才会显示。