各位大大好
小弟最近在試玩ng4遇到使用麵包屑(breadcrumb)例子，想請問breadcrumb在route的部份一般都如何設計呢？
因為第一次玩，找angular breadcrumb又很常找到angualrjs的，
覺得有點不知道該怎麼弄…
假設首頁>加入會員>填寫會員資料這樣的例子在route的部分是不是就要設計成
{
path:'home',compoment:homecompoment,
children:[
{path:'join',compoment:joincompoment,
children:[
{ path:'register',compoment:registercompoment}
]
}
]
}
有去找到ng2-breadcrumbs的library
但好像就跟route有關連，在設計思考上有點不知道如何下手
跪求各位大大指點迷津QQ
看你阿 可以寫子路由 也可以寫在同一層
我在FB上詢問的結果看起來應該是跟route設計沒什麼關連~只是因為我看了這個的使用方式有點迷罔…
想說該不會要跟route設計有關係吧……越想越頭痛…orz…才發文詢問版上有經驗的大大們QQ
想知道 + 1 哈哈哈
看起來麵包屑的結構只是一個陣列，比較麻煩的是每一個link怎麼對應到那一頁，
我在stackblitz上面用Bootstrap4寫了一個demo給您參考看看！
跟routing一定有關係，畢竟要知道現在跑到哪一頁才能在麵包屑上面顯示出正確的位置，
主要的邏輯都在app.component.ts，另外routing我有註解掉另一組，那樣的寫法也行，
差別只在routing如果很多層那內容也會一層一層疊上去
感謝大大回覆，我來研究看看，我本來還在打算，想寫在route裡面的data，類似下面的定義的那樣XD，
不過感覺您寫的方式比較好，我來研究看看~感謝熱心幫助~
{
path:‘home’,compoment:homecompoment,
data:{
breadcrumb:[
{titile:‘Home’,‘url’:‘home’}
]
}
children:[
{
path:‘join’,compoment:joincompoment,
breadcrumb:[
{titile:'首頁,‘url’:‘home’},
{titile:‘加入會員’,‘url’:‘join’}
]
},
{
path:‘register’,compoment:registerCompoment,
breadcrumb:[
{titile:‘首頁,‘url’:‘home’},
{titile:‘加入會員’,‘url’:‘join’}
{titile:‘填寫資料’,‘url’:register’}
]
}
]
}
麪包屑導航實現方式有很多種，見仁見智，你可以做一個和業務結合比較緊密的方式。 另外有關麪包屑導航的組件庫你可以參考我的一個實現：Element UI
根據 router 與 children router 對應的 path 來識別分發導航。
這裏你可以寫很多的子路由與嵌套路由，可以向我那樣寫一個麪包屑的小組件。由於不同的路由會修改 url，就可以加載一個公共的 Service，監聽路由事件同時從 Map 映射表表中找出合適的字段分發，根據包含的 / 數量分發不同層級。
當然也在業務中用一個專用的麪包屑組件，在父級引入。在組件裏監聽路由變化事件改變自己的形態。
你也可以把麪包屑組件寫成一個靜態的木偶組件，只根據輸入不同文字顯示不同效果，在每個子組件中都引入它，然後手動的給它分配文字。
