routerLinkActive with dynamic url doesn't work Angular 9

Question

I have the following html template:

<a [routerLink]="'/views/' + typeParam + '/my-recently-updated'" routerLinkActive="active">some text</a>

When I click on that link I see item is selected but when I reload page (press F5) then I see no selected items.

views-routing.module.ts:

const viewsRoutes: Routes = [
    {
        path: '',
        component: ViewsComponent,
        children: [
            { path: ':type', component: ViewsWrapperComponent },
            { path: ':type/:view_name', component: ViewsWrapperComponent }
        ]
    }
];

@NgModule({
    imports: [RouterModule.forChild(viewsRoutes)],
    exports: [RouterModule]
})
export class ViewsRoutingModule { }

How can I resolve this?

Can u put your router module in question ?

Cagri Tacyildiz
– Cagri Tacyildiz

2020-05-19 09:15:51 +00:00
Commented May 19, 2020 at 9:15 — Cagri Tacyildiz
– Cagri Tacyildiz, Commented May 19, 2020 at 9:15
@pc_coder ready

A. Gladkiy
– A. Gladkiy

2020-05-19 09:27:48 +00:00
Commented May 19, 2020 at 9:27 — A. Gladkiy
– A. Gladkiy, Commented May 19, 2020 at 9:27

A. Gladkiy · Accepted Answer · 2020-05-19 10:18:18Z

2

I resolved it this way:

<a [routerLink]="'/views/' + typeParam + '/my-recently-updated'" 
    routerLinkActive="active"
    [routerLinkActiveOptions]="{ __change_detection_hack__: typeParam }">some text</a>

as here issue on github

edited May 19, 2020 at 10:18

answered May 19, 2020 at 9:46

A. Gladkiy

3,5028 gold badges47 silver badges94 bronze badges

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

Collectives™ on Stack Overflow

routerLinkActive with dynamic url doesn't work Angular 9

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