2017-02-10 195 views
1

我定義的路由配置的參數化路線的多個實例:設置標題

{ route: 'page/:id', name: 'page', moduleId: 'page', title: "Page #" } 

我也得到了另一個組件聽router:navigation:complete事件(EventAggregator),而且,當不同的片段發現它將它添加到數組並將其顯示在屏幕上(作爲一種歷史列表)使用NavigationInstruction.config.navModel.title

當我使用不同的ID時間導航到'頁面'組件時,例如#/page/1#/page/2,#/page/3。我從activate()方法呼叫NavigationInstruction.config.navModel.setTitle("Page " + id)

在我的歷史,我最初看到:

"Page 1"` 

...然後導航到#/page/2時...

"Page 2" 
"Page 2" 

...然後導航到#/page/3時...

"Page 3" 
"Page 3" 
"Page 3" 

因爲RouteConfig是在不同的NavigationInstructions,更改navModel.title值會影響從RouteConfig派生的所有NavigationInstructions

任何人都有任何想法如何爲頁面組件的每個實例設置自定義標題? Aurelia預計會處理同一組件的多個同時實例嗎?

我考慮過使用新的router.transformTitle鉤子,但是因爲我最終可能在標題中包含更多信息,例如, "Page 1: Contents","Page 2: The First Chapter",這感覺是次優的,並且可能讓我做了很多滾動我自己的體系結構來動態地解析字符串。

+0

是否有可能訂閱不同虛擬機中的事件聚合器,但在離開時忘記取消訂閱? –

+0

不,我訂閱路由器的VM:navigation:complete在應用程序的整個生命週期內都是持久的。因此,這不是一個多路呼叫問題,只是路由器從一個RouteConfig對象獲取標題,該對象在所有針對它生成的NavigationInstructions之間共享。 –

回答

1

我創建了一個非常簡單的應用程序來測試這個。儘管如此,我的確採用了一些略有不同的策我在page視圖模型上使用activate回調,而不是訂閱router:navigation:complete事件。 這裏是我的代碼:

export class Page { 
    activate(params, route, instruction) { 
    this.pageNumber = parseInt(params.id || '1'); 
    instruction.config.navModel.setTitle("Page " + this.pageNumber) 
    } 
} 

我沒有看到你所看到的行爲:

History Screenshot

正在使用的是何種版本的框架模塊的?

+0

不確定這是測試相同的情況。在那個版本中,一次只有一個NavigationInstruction,每次訪問歷史記錄中的任何頁面時都會更新NavModel(在調用.setTitle之前,它將設置爲上一頁中設置的值你可以導航到)。 –

+0

雖然您可能已經暗示瞭解決方案。我可能不得不通過存儲或更新導航標題來解決這個問題:路由器:完整的,而不是直接引用NavigationInstruction--這似乎只是爲了有一個連接到特定導航操作的生命週期,而不是比所討論的片段。 –

+0

我不確定我是否關注你。 –

0

從查看代碼和回覆(謝謝@Ashley Grant),似乎我對NavigationInstruction的期望不準確。

A NavigationInstruction表示觸發,導航,停用先前頁面和激活新頁面以及觸發作爲該過程的一部分觸發的任何事件的單個工作流程。

它不像我想的那樣代表RouteConfig的一個實例(即片段加上參數)。因此,在navigation:router:complete事件已經被解僱之後提及NavigationInstruction並非意圖,因此不起作用!

現在我將重寫我的代碼拿冠軍的副本,當navigation:router:complete事件觸發(其實這是不平凡的,需要調用的指令_buildTitle()私有方法) - 並有提出了FR - https://github.com/aurelia/router/issues/469 - 要求這項操作不透明。