Hello there,
I am in the process of developing an Ionic app and incorporating the Ionic Native Calendar plugin. My goal is to utilize this plugin to dynamically adjust the calendar event parameters through JSON linked to a Firebase database, rather than hardcoding them within the app as shown in the demo (since my calendar events will frequently change). The available calendar parameters include strings, start and end dates, which gives me hope that this customization is achievable.
Currently, I have successfully implemented the app using the outlined method in the documentation. However, this approach restricts me from updating the data dynamically since I am required to preset the calendar parameters in the app itself, particularly in the home.ts
file based on my current scenario...
Within my home.html
file, I have a button that, once clicked, should trigger the creation of a calendar event:
<button ion-button (click)="createEvent()">Add to Calendar</button>
In my home.ts file, I have defined the following function:
import firebase from 'firebase';
constructor(...) {
firebase.database().ref('events').on('value', snapshot => {
this.events = snapshot.val();
});
}
Further down in my home.ts
file, outside the constructor
, I have implemented the following function...
createEvent() {
this.calendar.createEvent('Easter Celebration', 'myChurch', 'Be there or be square', new Date(2017, 9, 20, 13, 0, 0, 0),
new Date(2017, 9, 20, 14, 0, 0, 0)).then(() => {
console.log('Event Created!');
}).catch((err) => {
console.log('Oops, something went wrong:', err);
});
}
The structure of my current JSON file (which also fetches other information for my page) appears as follows:
"events" : [ {
"image" : "http://via.placeholder.com/512x800",
"title" : "Easter Weekend Celebration",
"day" : "10 April 2017",
"photo" : "http://via.placeholder.com/512x512/000",
"address" : "4 Pybus Rd, Sandton, New York“,
"times" : "Sundays, From 08h00 - 11h00",
"info" : "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.”,
"RegisterURL" : "https://www.google.com",
"calendar" : "some-data"
This JSON file is connected to a Firebase database.
The issue lies in the inability to dynamically modify the calendar values using the aforementioned method. I am seeking guidance on how I can achieve the same functionality by retrieving the values from a JSON file instead of manually inputting them into the app. Since I already have a JSON file controlling other dynamic data in my app, I aim to integrate the calendar values seamlessly as well.