Pull data from firebase into a calendar

@ryan-kelly1997 wrote:

Hi,
I want to have a calendar that pulls information from a database in firestore and populates the corresponding dates in the calendar. For example if there was an event on the 28th march I want the calendar to connect to firebase where there is an event inside a collection and when the calendar loads, have the dates from firebase inside the calendar.

I have made the basic calendar in Ionic using ion-2-calendar. I have also established a connection to firebase inside the project and verified this with a console.log() statement which pulls from a sample database collection called competition with a date inside it

The tester collection includes a string for date i.e “28th May” and also a timestamp with the time as well in the format March 28th 2020 I’m not sure which is best to use.

If anyone could help me with this, it would be appreciated

Code is here

Html

Calendar Page

<ion-calendar [(ngModel)]="date"
  (onChange)="onChange($event)"
  [type]="type"
  [format]="'YYYY-MM-DD'">
</ion-calendar>

TS
import { Component } from ‘@angular/core’;
import {tap} from ‘rxjs/operators’;
import {AngularFirestoreModule, AngularFirestore} from ‘@angular/fire/firestore’;
import {Injectable} from ‘@angular/core’;

@Component({
selector: ‘app-home’,
templateUrl: ‘home.page.html’,
styleUrls: [‘home.page.scss’],
})
export class HomePage {
date: string;
type: ‘string’;

constructor(private afs:AngularFirestore) {
this.afs.collection(‘competition’).valueChanges().subscribe(data=>{console.log(data);
})
}

Posts: 1

Participants: 1

Read full topic