Hi , im trying to implement a 3rd party plugin , ngWidgets-Calendar(http://www.ngwidgets.com/angularjs-widgets/) into my ionic app. Everything seems good however the calendar could not be use in touch screen devices. When i remove the ionic framework, and just left the calendar, it works perfectly . Can someone help me in this . i really need this plugin in my ionic app .
My libs:
<script src="scripts/angular/angular.min.js"></script>
<script src="scripts/angular/angular-ui-router.js"></script>
<script src="scripts/angular/angular-animate.js"></script>
<script src="scripts/angular/angular-sanitize.js"></script>
<script src="scripts/ionic/ionic-angular.js"></script>
<!--ngwidgets For Calendar-->
<script src="scripts/ngWidgets/ngxcore.js"></script>
<script src="scripts/ngWidgets/demos.js"></script>
<script src="scripts/ngWidgets/ngxcalendar.js"></script>
<script src="scripts/ngWidgets/ngxdatetimeinput.js"></script>
<script src="scripts/ngWidgets/ngxtooltip.js"></script>
<script src="scripts/ngWidgets/globalize.js"></script>
my page codes are here:
<ion-view title="Scheduler">
<ion-nav-buttons side="right">
<button class="button button-positive icon ion-plus" style=" border-radius:25px;">
</button>
</ion-nav-buttons>
<ion-content padding="true">
<ngx-calendar ngx-show-other-month-days="false" ngx-settings="calendarSettings"></ngx-calendar>
<div class="bar bar-header bar-calm">
<h1 class="title">{{todayString }}{{date | date:'dd-MMM-yyyy'}}</h1>
</div>
<ion-list ng-repeat="item in items" ui-sref="schedule.map({appt: $index})">
<ion-item class="item-icon-right" >
{{item.name}}
<i class="icon ion-ios-arrow-forward"></i>
<ion-delete-button class="ion-minus-circled">
</ion-delete-button>
</ion-item>
</ion-list>
</ion-content>
</ion-view>
My controller code:
app.controller(‘CalendarController’, function ($scope, ApptListService) {
$scope.items = ApptListService.appts(); // populate list
//var theme = prepareTheme();
$scope.calendarSettings = {
height: ‘350px’,
enableHover:true,
showFooter:true,
enableViews:true,
enableTooltips:true
}
$scope.todayString = “(Today)”;
$scope.date = new Date();
});