Angular - Sidebar submenu dropdown redirects to Login Page-CodePudding

In my Angular-13 project, I am using AdminLte3. I created Sidebar Sub-Menu. Before I added routerlink, everything was working perfectly.

component:

export class AdminSidebarComponent implements OnInit{

  constructor() {
   }

   ngOnInit(): void { 
  }
}

html:

<li >
  <a href="#" >
    <i ></i>
    <p>
      HRM
      <i ></i>
    </p>
  </a>
  <ul >
    <li >
      <a [routerLink]="['/employee-list']" routerLinkActive="active" >
        <i ></i>
        <p>
          Employees List
        </p>
      </a>
    </li>
    <li >
      <a [routerLink]="['/department-list']" routerLinkActive="active" >
        <i ></i>
        <p>
          Department List
        </p>
      </a>
    </li>
  </ul>
</li>

After the user successfully logs in, then he clicks on sidebar dropdown menu, it is expected that it drops down and displays the sub-menu. Instead of the sub-menu to dropdown, it redirects back to the login page. But when I click on the click to go back on the browser and clicks on the sub-menu again, it drops down.

What could be wrong, and how do I correct this?

Thanks

CodePudding user response：

It could be due to the href you added to the anchor tag

CodePudding user response：

Please add those routerLink to the li items instead of adding them on a tag.

And one more thing which needs to be checked is path of the routing which we are providing into the routerLink. As we are adding / so it will take relative path.

If it is not relative in your application then please remove that / and try then.

I hope it will work.

Please feel free to comment below in case issue still persists.

Thanks.