CODEWITHSUNDEEP
angularionic-frameworkionic2
S.Yadav
S.Yadav

Reputation: 4509

Why does itemClicked() function not work sometimes in ionic2 / angular2

The problem

A very common problem of the Angular (click) functionality is that when you're using <div> tags, then it may not work.

In some cases you will need to click two or three times.

I had the same issue myself, after researching a lot I found the solution:

Just exchange <div> tags with <buttton> tags.

My previous code:

<div class="some-outer-class">
      <div class="some-inner-class" (click)="itemclicked($event, someId)">
              Explore
      </div>
</div>

It is now with the <button> tag.

<div class="explore-outer-container">
     <button class="explore-rotate-text" (click)="itemclicked($event, someId)">
          Explore
      </button>
</div>

Note: both <div> and <span> do not work well.

Hope it will help you too.

Some other sources-

  1. ionic framwork

  2. Blog

Upvotes: 2

Views: 270

Answers (1)

Ivar Reukers
Ivar Reukers

Reputation: 7719

Ionic currently has a bug relating it's navCtrl.push() method and using a selector: your-selector tag on the page you're pushing to.

This will cause the page to reload itself when you click the first time but loads good after you click the div for the second time, which would explain your problem of having to click twice.

But because I do not know what your itemClicked() is executing, I couldn't say for sure.

(If this is your problem see: https://github.com/driftyco/ionic/issues/7979#issuecomment-244882983 which was my own issue)

Upvotes: 1

Related Questions