Navigation issue - double click to push new page


#1

Running into this odd behaviour, thinking perhaps its a bug, but who knows, I may be doing something wrong. Have followed the Pae structure of the auto generated app.

I have a list of buttons generated through an *ngFor, each button is clickable and pushes a new page.

When one of the list items is clicked, a new page is pushed into the stack and it shows up. Perfect. I click “back” on the auto generated button, it takes me back the root view. Perfect.

However when I click any button on the there after it requires a double click to navigate. Almost as the focus has been taken off the element onto the element, and it now requires one click to re-focus, then the second click to run the desired method.

Obviously not an intended behaviour of a native app. Anyone else run into this? Ideas of how to fix?

I have my rootPage, within there structure goes along the lines:

<ion-nav>  ... <ion-/nav>
<ion-content>
   ...
<ion-/content>

#2

would you be able to create a simple demo of this?


#3

It may be possible that the button is being wrapped around another element that blocks the ui-interaction with that button for a while (couple of seconds).
If you find such an element, try adding the pointer-events: none; css property to it, this makes it so presses go through the element and allows you to reach the button with a tap.


#4

Mhhh, going to give that a try. Also worth noting this is only an issue using the iOS emulator. Web it’s fine. Haven’t tried Genymotion yet/


#5

It only seemed to be an iOS issue for me as well.
I had it occur in a different scenario, but it could possibly also be the root of your problem.


#6

same here, on iOS too.

it happens after a back action “navController.pop”

When I first load the first page, click the link, everything’s fine, it goes to the second page.
I hit back, click the same link, nothing happens. Click again the same link, then I go to the second page again.


#7

for the record, with Beta 11, still face the same issue described above in my previous comment


#8

Haven’t tested this thoroughly yet, but I think this issue may be a side effect of having created my navbar as a component, and then passed the component in on all the pages where needed. Noticed when I am in child views where the navbar was drastically different, and I created them within the page themselves, this doesn’t seem to be an issue.

Again, has not been confirmed, but is a hunch I’m having. Will update once tested


#9

any solution for this? I have the same issue


#10

I’m having the same problem. Does someone have any update about this?


#11

With RC?

I even forget that problem but couldn’t reproduce it anymore, but my app changed so much in the meantime…


#12

Yes, I just created a fresh new app with RC1. The problem fixed itself on its own in your app?


#13

Like I said, I did massive changes in the core of my app, so that maybe the reason…gonna have a look during my tests if I still could reproduce it


#14

Hi,

I’m having the same issue.
It only appears on IOS, in Android it works fine.

Any idea what could be the root cause?


#15

On iOS, the problem appears if you add a (click) directive on a HTML tag that is not a “button”.
However, I don’t know how to fix it.


#16

If you add, in case of other element than button, the keyword “tappable” do you still face that issue?


#17

Yes it solves the issue, thanks!


#18

Its Works! Thank you very much