Unable to trigger ngOninit and route.params upon redirection using RouterLink

Question

I'm trying to redirect from one page to another using routerLink, but the redirected link doesn't trigger the ngOnInit() method as well as the ActivatedRoute subscription. The redirected page then freezes but there is no error on the console.

So this is my HTML

<a [routerLink]="route(value.id)">link</i></a>

Then this is my component.ts, which returns the url

route = (id: number) => this.routeService.view(id);

This is the redirected component edit.ts

ngOnInit() {
  this.route.paramMap.pipe(
    takeUntil(this.onDestroy$),
    map(params => console.log(params))
).subscribe(x => 'do something')

}

can you edit the question and explain what are you trying to achieve and what is actually happening? because the question is unclear now. — k0hamed, Mar 21 '19 at 01:14
Does the redirected component render or it doesn't load at all? — k0hamed, Mar 21 '19 at 01:36
`[routerLink]` expects a string or array of strings not a function call. It won't evaluate the function call. Try replacing `[routerLink]` with `(click)`. — Jason White, Mar 21 '19 at 01:40
@JasonWhite It needs to be [routerLink] so I could redirect to another page. — Jin, Mar 21 '19 at 01:45
can you post the two components classes as a whole? the context still isn't clear. — k0hamed, Mar 21 '19 at 01:52

score 1 · Answer 1 · answered Mar 21 '19 at 02:51

I did a little hack, I used NgZone. routerLink directive seems to run outside Angular zone. So instead of using [routerLink]="route(value.id)" I used (click)="route(value.id)" . So this is how it looks like now

HTML:

<a (click)="route(value.id)">link</i></a>

Component:

constructor(private ngZone: NgZone){}

route = (id: number) { 
    const link = this.routeService.view(id);
    this.ngZone.run(() => this.router.navigate(link));
}

Thanks for replying..

Unable to trigger ngOninit and route.params upon redirection using RouterLink

1 Answers1