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 : https://ibb.co/2qfWCMN

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