roundslider UI is malfunction due to ionic.bundles.js file in ionic android app

Question

I searched alot about this topic but couldnt find any answer. I am ionic to build a android app. I used roundslider component from www.roundsliderui.com. Though whole roundslider fully works but the text input right in middle of roundslider does not work in ionic. I figured out that ionic.bundles.js script in ionic app is causing problem. If I remove this script, roundslider works fine.

Any advice why this script causing problem?

Thanks

Answer 1

I had the same issue. You have to disable the tap functionality.

http://ionicframework.com/docs/api/page/tap/

"In some cases, third-party libraries may also be working with touch events which can interfere with the tap system. For example, mapping libraries like Google or Leaflet Maps often implement a touch detection system which conflicts with Ionic’s tap system."

<div data-tap-disabled="true">
    //Your Round Slider here...
</div>

I hope it helps.

Answer 2

there is a conflict between files of roundsliderui and ionic
read this article thats will help you

The problem is that the modal is not fully loaded at the time the circular-slider is rendered. This article states correctly that the offsetPosition is null if the document (in this case, the modal) is not finished loading