Durandal(Jumpstar) - 为结果视图添加搜索侧栏窗格

时间:2013-04-07 12:42:59

标签: knockout.js durandal

我在durandal中创建了一个用于显示产品列表的视图。

我希望能够搜索这些产品,这就是为什么我要在侧边栏中添加一个仅针对此产品视图显示的搜索表单。

边栏必须在产品视图之外声明,因此每当我更改搜索表单中的过滤器时,它都不会随之刷新。 意思是,我需要一个外部侧边栏来刷新视图,并且仅在激活此视图时才会出现。

我不知道如何开始实施它,最好的方法是什么。帮助会很棒。

1 个答案:

答案 0 :(得分:0)

您可以采取一些不错的方法,但最佳选择取决于您如何为搜索表单分配侧边栏区域。

归结为您希望产品视图模型和搜索表单的紧密耦合。

共享相同的视图模型(或部分视图模型):如果您可以在两个视图模型之间共享相同的KnockOut可观察量,那么其余部分几乎都是“常规业务”。您可以通过在产品视图模型和搜索表单视图模型之间共享ko.observable来实现此目的。这可以通过以下方式之一完成:

  • 分享一个共同的视图模型库(这里有一些信息:View Model inheritance when using Durandal
  • 创建一个单独的模块,产品VM和搜索VM都需要
  • 设置Durandal组合,使它们都使用相同的视图模型。然而,这不是很直观,我不会为此推荐它。

一旦你有一个可用的共享模型,你可以从两个视图绑定它,KnockOut的可观察性应该能够提供你需要的所有反馈。

更松散耦合的方法是使用pub / sub技术。这使得模块非常独立,但是存在关联的管理和维护后果,就像使用全局变量时一样。我只会在必要时保持视图模型彼此隔离,或者当物流不允许视图模型相互了解时才推荐这个。

在发布/订阅方案中,搜索VM只发布产品VM列出的事件,反之亦然。有许多JS库提供此功能。它甚至包含在Durandal的一部分中 - 这里有一些信息:Durandal: Leverage Publish and Subscribe另请查看Durandal Event reference