bug: passing a function to [routerLink] causes pre-page-load eternal loop

[arnotixe]

Bug Report

Ionic version:

[x] 4.x [x] (5.0.0 actually)

Current behavior:

bogs down browser and no output, except a "browser was throttled" notice in devtools (Chrome)

Expected behavior:

OK this is my fault, but could it be detectable, warnable or something? Firefox shows nothing, Chrome shows a throttling warning without reference to what actually causes the loop.

Steps to reproduce:

in template, pass a function doing navigation to routerLink, like: [routerLink]="navigateToPage()"

actual template <ion-item *ngFor="let item of showProducts; let i = index" [routerLink]="goProductDetail(item)" >

actual function goProductDetail(item:string) { this.router.navigateByUrl('products/'+item); }

OBVIOUS FIX of my own offending code is either passing an actual link to routerLink: <ion-item *ngFor="let item of showProducts; let i = index" [routerLink]="'/detalleproducto/item' + item.fid" >

or passing (click) + function, not [routerLink]+function: <ion-item *ngFor="let item of showProducts; let i = index" (click)="goProductDetail(item)">

Related code:

insert short code snippets here

Other information:

Ionic info:

insert the output from ionic info here

[liamdebeasi]

Thanks for the issue. As per the docs, the routerLink property takes in a route: https://ionicframework.com/docs/angular/navigation#navigating-to-different-routes. The navigateByUrl call is found within the Angular Router, so if there were a warning I think it would be better placed there. Thanks!

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.