怎樣去控制app.component.html 裏的routerlink 去隱藏(hide)或顯示(show)?

我在app.component.html裏做了一個sidenav menu 去顯示routerlink連結,當user登入系統,sidenav menu會顯示user 類型的routerlink連結,而當admin 去登入系統,sidenav menu會顯示admin 類型的routerlink連結。我是將user type的value 儲存在local Storage 裏,當我用user身份去登入系統,sidenav menu是不會立刻去顯示user部份routerlink連結,我需要去(按F5)載新載入網頁才可以。請問怎樣可以不需要載新載入網頁就能夠立刻去顯示不同user 類型的routerlink連結呢?

我在app.component.html 裏是用*ngIf去控制不同user 類型的routerlink連結去隱藏或顯示。

thank you very much.

可以去監聽路由的變化

請問是不是用EventEmitter?
https://angular.io/api/core/EventEmitter

有程式碼嗎?

請問是不是用NavigationStart? 因為我的程式碼很多,而且想自己學。你告訢我方法就可以了。thank you very much.

在網上找資料,都是不明白,監聽路由的變化怎樣做得到我想要的功能。

以下是我的CODE:

你的程式碼看起來沒有什麼問題,而且我也沒看到有設定 utype 為 admin 的地方, 請提供檔案名稱與程式碼行數

設定utype 為admin ,我還未做。我是將value 儲存在service module 裏去判斷utype 是什麼,然後去顯示sidenav menu什麼內容。
我想問監聽路由的變化是不是類似其他網頁程式,例如: index.php?utype=admin。然後angular 就會讀取link裏的內容?.

thank you very much.

不需要,如果網頁還沒有關,他會儲存在記憶體中,只要有異動,相關有用到的都會跟著異動

1個讚

是不是我這個去顯示不同的routerlink連結就可以?

你的需求確實是那樣做就可以了,只是通常我們會用 ts 的地方去控制,html 就只是單純的顯示而已

我以為大部人會將value 儲存在localstorage 裏去控制去顯示不同的routerlink連結是通常做法,所以就問這個問題。而且自己都是學了angular 幾個月,所以聽到監聽路由的變化,覺得之前沒有網頁教過,所以想知道是什麼和有什麼用。

多謝Kevin 的幫助,令到我學了很多東西。