CSS-menu issue in angular project

Question

I am trying to add a bootstrap menu to my angular 6 project. This is the code

  <ul class="nav nav-pills">
  <li class="nav-item">
    <a class="nav-link active" href="#">User</a>
  </li>
  <li class="nav-item dropdown">
    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#">Customer</a>
    <div class="dropdown-menu">
      <a class="dropdown-item" href="#">OL User</a>
    </div>
  </li>

</ul>

The issue is, when I click customer link, URL redirect to the localhost:4200/# and submenu is not opening. below code techniques, I used to project:

app.component.ts

import {HashLocationStrategy, LocationStrategy} from '@angular/common';

app.routing.module.ts

@NgModule({
  imports: [RouterModule.forRoot(routes,{useHash: true})],
  exports: [RouterModule],

})

tagged angularjs but is asking about angular - should be editted — Jonas Praem
– Jonas Praem, Commented Nov 2, 2018 at 8:42

Jonas Praem · Accepted Answer · 2018-11-02 09:02:30Z

2

Local redirects in Angular are usually done by using routerLink:

From the DOCS

<a [routerLink]="['/user/bob']" [queryParams]="{debug: true}" queryParamsHandling="merge">
  link to user component
</a>

More information about Angular routing

You can use href if you want. But the biggest issue is that you haven't associated a component with a route.

Take a look at this example

edited Nov 2, 2018 at 9:02

answered Nov 2, 2018 at 8:41

Jonas Praem

2,4745 gold badges37 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

CSS-menu issue in angular project

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related