2013-04-07 60 views
0

我在durandal中創建了一個用於顯示產品列表的視圖。Durandal(Jumpstar) - 爲搜索結果視圖添加搜索邊欄窗格

我希望能夠搜索這些產品,這就是爲什麼我想在僅顯示此產品視圖的側邊欄中添加搜索表單。

側邊欄必須在產品視圖外聲明,因此無論何時我在搜索表單中更改過濾器時都不會刷新它。 手段,我需要一個外部側邊欄,將刷新視圖,並且只會激活此視圖時出現。

我不知道如何開始實施它,什麼是最好的方式來做到這一點。幫助會很好。

回答

0

您可以在這裏採取幾種體面的方法,但最好的選擇將取決於您如何爲搜索表單分配側欄區域。

這涉及到你想要產品視圖模型和搜索表單的耦合程度如何。

共享相同的視圖模型(或其中的一部分):如果您可以在兩個視圖模型之間共享相同的KnockOut observables,那麼剩下的幾乎是「一切照舊」。您可以通過在產品視圖模型和搜索表單視圖模型之間共享ko.observable來實現此目的。這可以在一個做了以下幾個方面:

  • 共享一個共同的看法,示範基地(這裏是對一些信息:View Model inheritance when using Durandal
  • 創建一個單獨的模塊,無論是產品的VM和搜索VM可能需要
  • 設置了Durandal構圖,以便它們都使用字面上相同的視圖模型。然而,這不是很直觀,我不會爲此推薦它。

一旦你有一個可用的共享模型,你可以在兩個視圖中綁定它,並且KnockOut的可觀察性應該能夠提供你需要的所有反饋。

更鬆散耦合的方法是使用pub/sub技術。這使得這些模塊相當獨立,但是存在相關的管理和維護後果,就像使用全局變量時一樣。我只會在需要保持視圖模型儘可能彼此隔離時,或者當物流不允許視圖模型彼此瞭解時才推薦這一點。

在發佈/訂閱方案中,搜索虛擬機只發布產品VM列出的事件,反之亦然。有許多JS庫提供這種功能。它甚至包括在Durandal的一部分 - 這裏的一些信息:Durandal: Leverage Publish and Subscribe也看看Durandal Event reference