-
在命令行使用 ng new router -- routing
image.png
Router 和 RouterLink 的作用是一樣的
- Router是在 控制器中使用 而 RouterLink是在<a>標(biāo)簽中使用
下圖是五個(gè)路由對(duì)象在項(xiàng)目中的使用框圖
image.png
- 下圖是配置路由的文件 需要注意的是 **********path里面不需要 以斜杠開頭***
image.png
- 與上面配置不同的是 當(dāng)我們需要在模板中使用路由時(shí)就應(yīng)該使用routerlink 但是需要注意的是我們需要 routerlink 的屬性需要以斜杠開頭 同時(shí)routerlink 后面的參數(shù)是一個(gè)數(shù)組 目的是為了在后面?zhèn)鬟f相應(yīng)的參數(shù) 正勒。后面的章節(jié)中有寫荡含。
image.png
- 下面我們看一下通過Router方法是如何實(shí)現(xiàn)路由的 ：
image.png
我們?cè)谀０逯袑懥艘粋€(gè) 按鈕 并且給他綁定事件方法 此時(shí)間方法在組件中進(jìn)行完成它褪，此時(shí)用到了Router 方法了 代碼如下：
image.png
- 當(dāng)我們輸入不存在的路徑時(shí)我們希望出現(xiàn)相應(yīng)的處理頁面 所以我們定義了一個(gè) 錯(cuò)誤界面的組件來處理這種問題 如下圖 通配符的路由一定要放在最后面孟辑。
image.png
