ionic/angular leaflet directive - zoom in/out buttons do not work

Question

I have some problems with default zoom in/out buttons on leaflet map. Everything works fine when I load page directly but when I change one state to state where leaflet dire

Answer 1

Seems like ionic has a bug on the touch events handler. However, a colleague of mine came up with a workaround until it gets fixed.

Basically, use his version of ionic.bundle.js (https://rawgit.com/cachiconato/ionic/angular-leaflet-control/release/js/ionic.bundle.js) and add 'data-do-not-set-coordinates="true"' to each possible tag linking to the map.

http://codepen.io/anon/pen/sHpoy?editors=101

 <h2 data-do-not-set-coordinates="true">{{location.name}}</h2>

Answer 2

The solution was simple. Ionic was "eating" all click events which was not created by a framework. For the container of leaflet map there was a need to add attribute data-tap-disabled="true"

<ion-content data-tap-disabled="true">
    <leaflet height="480px"></leaflet>
</ion-content>