I am working on an angular reusable menu, when we press on a menu item it displays the element linked to the router and adds a css class to show that it is indeed activated.

However, if I click on another choice than on the first one for example "about" and that I refresh the page, in spite of the url "/ about" it activates me the first choice.

SO I had this in the ngOnInit method :

for (const m of this.menu){
      if(this.router.url === m.link) m.isSelect = true
    }

I don't know what to do..

CodePudding user response：

remove the "/" before the "about" path,and then try it

CodePudding user response：

You don't give information; so I am making some assumptions. When you click around on Angular page, you are navigating within the page according to Angular routing (that's why it's called Single Page Application).

However, when you click refresh in the browser or hit F5 - you send request to the server. You can confirm that by opening F12 developer tools and see that is the request in the Network tab.

The server doesn't know about your path, and probably sends 404 back to the client. Or maybe you have rewrite module (on Apache), or some routing solution (say, on IIS). As result, you get unexpected navigation to the first choice.

Again, this is just a guess. You need to give much more than just a loop that may or may not be relevant to your question