Stack Overflow
Stack Overflow

Questions tagged [routerlinkactive]

60 questions
2
votes
0 answers

Angular Material 2 Tab Links unable to set default active tab

After a successful login on the login page, the route changes to the "inbound" view, which has two tabs in the navbar, "inbound" and "outbound". I'd like for the "inbound" navtab to be already selected to reflect the state of the router. However,…
tyler2cr
  • 73
  • 1
  • 1
  • 9
2
votes
0 answers

Angular 2 RouterLinkActive class for child routes

I have a nav component with a sub nav associated to it. The data structure is as follows: { title: 'Layout', routerLink: 'layout', // main nav subNav: // sub nav { title: 'Layout', items: [ { title: 'Layout',…
BradBeighton
  • 83
  • 1
  • 9
2
votes
1 answer

Angular 2, adding active class to router link [Best practice]

I'm using the InputrouterLinkActive to add active class to some specific url. But I want that specific link is always active if it detect a chunck of word. Let I explain: if my defined route is /rent/page/:id, and into my template, I do this:
Radonirina Maminiaina
  • 6,958
  • 4
  • 33
  • 60
1
vote
1 answer

Angular routerLinkActive not working when navigating using skipLocationChange

Suppose I have following routes: const routes: Routes[] = [ { path: 'a', component: AComponent }, { path: 'b', component: BComponent } ] And I have some Navbar link with routerLinkActive class when on path a like this:
  • JelmaLieur
    • 33
    • 4
    • 1
    vote
    1 answer

    routerLinkActive on parent element not working when routerLink is not directly inside parent, but in seperate component

    I want to set a class on a div when one of the routes inside that div is active. This works all fine with the routerLinkActive directive when I put links with a routerLink directive directly inside the div:
    Waterstraal
    • 399
    • 4
    • 16
    1
    vote
    2 answers

    routerLinkActive id coupled with [ngClass]

    Below web-link demonstrates the routerLinkActive id working when used as a boolean value for a distinct HTML element' [ngClass] https://stackblitz.com/edit/routerlinkactivesimple?file=src%2Fapp%2Fapp.module.ts In contrast the routerLinkActive id is…
    Caesarius
    • 115
    • 5
    1
    vote
    3 answers

    Angular routerLinkActiveOptions

    I have some link like this
  • Contracts
    • You see here in params i have ?activeOnly=false with this…
    Miomir Dancevic
    • 6,726
    • 15
    • 74
    • 142
    1
    vote
    1 answer

    Add Active class for multiple routes in Angular

    I have a side bar which has multiple option in it.I set routerLinkActive class to make particular option active when click but now if I go deeper or other route from that route,the active class is being removed.I wanted to stay one option active for…
    Annonymous
    • 45
    • 7
    1
    vote
    2 answers

    mat-nav-list always an item focused

    I have a navigation menu. When I open it, the button/link Gebruikers(users) always behaves as an active-list-item, but it shouldn't. Here is my HTML it is in a mat-nav-list, the *ngf is checking if the user should be seeing the link.
    H. Hakvoort
    • 161
    • 1
    • 2
    • 14
    1
    vote
    1 answer

    Angular 7 activated routes all active after refresh

    When I reload/refresh my app the routes in the menubar are displayed and all of the items are set to active. I have configured for the Routes: export const routes: Routes = [ { path: '', pathMatch: 'full', redirectTo: 'home', data: {…
    LeO
    • 4,238
    • 4
    • 48
    • 88
    1
    vote
    1 answer

    Angular routerLinkActive not working as expected

    I am working on a rather simple project but this issue has me stumped! I have routing setup and working correctly except for one small issue with the routerLinkActive not staying activated. I can't embed an image in a question yet, so please follow…
    dkearsley
    • 13
    • 1
    • 5
    1
    vote
    1 answer

    Angular 6 and PrimeNG p-table (Tables)

    Using a route with children in it. The parent route is recipes.component and in it, I includes a recipe-list.component and the . The recipe-list.component utilizes the PrimeNG p-table and when you click on a recipe, the recipe detail displays…
    amazonotter
    • 61
    • 1
    • 5
    1
    vote
    1 answer

    angular RouterLinkActive not matching child paths

    I am relatively new to Angular and am trying to get a highlight to work on my NavBar. I have been through some other articles but they are not quite helping. In my app-routing.ts file const routes: Routes = [ { path: '', redirectTo: '/dashboard',…
    PC Frank
    • 21
    • 1
    • 7
    1
    vote
    3 answers

    Add active class to routerlink in angular 4

    I would like to add an active class when changing routes. I have an link in one component (home page) which redirects to other component (details page). Now when I return back from…
    yer
    • 1,454
    • 2
    • 16
    • 33
    1
    2
    3 4