Routing takes 2-50+ clicks to work

I’m using the most recent version of ionic and angular, I want to make a list of buttons, where every button redirects to a page with info about that item (using data from firebase).

My button with a function call to router.navigate[’/itemdetails/’ , id] takes between 3 and 60 clicks before it finally works. It’s related to the angular routing but i have never ventured into webdev before so I have no idea how to fix this because it’s confusing that it sometimes works but never properly with only 1 click.

In app-routing.module I tried moving itemdetails/:id to home as a children : {} property (homepage displays list of items ) but this broke everything, also tried putting the dynamic above the static ip but nothing changed.

I tried generating itemdetails page as a itemcomponent instead of page, generated under the itemlist (home) page and then added it through home.module routes as {path : ':id; component:itemcomponent} but this never works just like the previous alternative way. This is really confusing for someone with 1 week of web dev experience, any help would be greatly appreciated

Sometimes it works every 3-5 clicks, sometimes it works after 50+ clicks?.. the id gets logged after each click.
This is the code :

Found about router tracing, the extra info allowed me to figure out this is an ionic compilation error or something like that and this explains why even with empty files i had this error, needed to run serve again. With this i was able to find that adding ? to the html of the itemdetailpage when working with lazy loading and a promise from a DB solved all my problems