Any calendar plugin for Ionic 2? (Solved)


#1

Hi everybody!

I need to implement a calendar in my hybrid app.
The calendar would not record events, it would only use it so that the user sees another color, the days in which it took its corresponding lesson.

I need something simple and functional. It’s not a DatePicker, it’s just informative.
I was looking for and found angular2-fullcalendar. I am currently testing it and it looks good but I want to know if it is the best option, or is there any other alternative.

Thanks people!!


#2

I used angular 2 - fullcalendar for this!

If anyone need help, can ask me!


#3

I am sure many like me would like to know the steps to be able to use the full calendar. I would appreciate if you could do a brief write up on how you managed to use it on this forum thread for everyone. Thanks.


#4

Sure!!

I followed the steps dictated by the user clementinsarant in this thread:

Then I went backing on the official documentation to modify it to taste:
https://fullcalendar.io/

I also made use of Jquery to change some things, for example, to change the default style of the buttons and to use an own image:

ionViewDidLoad() {
    this.changeDefaultButtons();
}

changeDefaultButtons(): void {
    let nextButtonImg: string = '<img src="img/ui-next-arrow100.png" width="35"/>';
    let prevButtonImg: string = '<img src="img/ui-back-arrow100.png" width="35"/>';

    setTimeout(() => {
        $(".fc-next-button").empty();
        $(".fc-prev-button").empty();

        $(".fc-next-button").append(nextButtonImg);
        $(".fc-prev-button").append(prevButtonImg);
    }, 100);
}

#5

how to create an event for long press on a date for android


#6

You can try angular-calendar also.


#7

hi can you share your git hub link


#8

#9

Just like @eivanov said earlier you can use angular-calendar

I wrote a write up about how to implement and optomize angular-calendar for ionic2

Hopefully that helps.


#10

I keep getting this error how can I fix this ? no such file or directory, open ‘/Users/Maitham/Developer/Tuto/Tuto/node_modules/angular2-fullcalendar/src/calendar/calendar.js’


#11

This simple one might be of help to some - it’s in Ionic3