使用Knockback.js过滤中的视图模型集合



我目前正在使用Knockback.js创建一个页面,该页面在表中显示员工的任务。我有一个任务的视图模型,它包含一个名为isSelected的布尔可观察对象。员工的视图模型包含称为"tasks"的任务视图模型集合的可观察集合。

我现在想添加一个名为"selectedTasks"的属性/函数/可观察对象,它只公开选定的任务。我想满足以下要求:

  • "tasks"one_answers"selectedTasks"都应该为我提供视图模型,而不是模型
  • 当我将模型添加到原始任务集合中时,可观察到的"任务"应该得到更新。
    • 当用户选择这个新添加的模型时,"selectedTasks"也应该得到更新
  • 每个任务模型应该只有一个视图模型。否则,我可能会得到一个视图模型,它表示没有选择任务x,而另一个视图模式则表示选择了x

为了更清楚地演示它,我创建了这个jsfiddle:http://jsfiddle.net/drojoke/cg6d88Lp/14/

到目前为止,我只使用了一个可观察的集合,使"tasks"属性的所有内容都正常工作,如下所示:

this.tasks = kb.collectionObservable(tasks, {
    view_model: function (task) {
        return new TaskViewModel(task);
    }
});

我使用view_model选项将tasks集合中的每个任务都转换为TaskViewModel。当我将新任务添加到tasks集合时,CollectionObservable会更新为expected。

我尝试创建一个selectedTasks属性作为带有筛选选项的CollectionObservable,如下所示:

this.selectedTasks = kb.collectionObservable(tasks, {
    view_model: function (task) {
        return new TaskViewModel(task);
    }, filters: function (task) {
        return task.isSelected(); // isSelected is undefined.
    }
});

但不幸的是,传递给filter函数的对象不是TaskViewModel,而只是一个任务对象,因此我无法访问isSelected observable。

我找不到太多关于过滤视图模型集合而不是模型的信息。我如何创建一个selectedTasks observable,过滤视图模型而不创建其他视图模型?

您可以简单地使用计算的可观察性:

this.selectedTasks = ko.computed(function() {
    return this.tasks().filter(function(task) {
        return task.isSelected();
    });
}, this);

相关内容

  • 没有找到相关文章

最新更新