diff --git a/Frontend/src/app/app.module.ts b/Frontend/src/app/app.module.ts
index 0147992..a0385c6 100644
--- a/Frontend/src/app/app.module.ts
+++ b/Frontend/src/app/app.module.ts
@@ -14,6 +14,7 @@ import {DatepickerComponent} from './components/datepicker/datepicker.component'
 import {EventDetailComponent} from './components/event-detail/event-detail.component';
 import {HttpClientModule} from '@angular/common/http';
 import {FormsModule} from '@angular/forms';
+import {ApiService} from './services/api/api.service';
 
 @NgModule({
     declarations: [
@@ -34,7 +35,7 @@ import {FormsModule} from '@angular/forms';
         NgbModule,
         FormsModule
     ],
-    providers: [],
+    providers: [ApiService],
     bootstrap: [AppComponent]
 })
 export class AppModule {
diff --git a/Frontend/src/app/components/datepicker/datepicker.component.ts b/Frontend/src/app/components/datepicker/datepicker.component.ts
index 2e3d135..804c018 100644
--- a/Frontend/src/app/components/datepicker/datepicker.component.ts
+++ b/Frontend/src/app/components/datepicker/datepicker.component.ts
@@ -1,4 +1,4 @@
-import {Component, OnInit} from '@angular/core';
+import {Component, EventEmitter, OnInit, Output} from '@angular/core';
 
 @Component({
     selector: 'app-datepicker',
@@ -16,7 +16,7 @@ export class DatepickerComponent implements OnInit {
 
     itIsWednesday: boolean = false;
 
-    selectedMonday: string = '';
+    @Output() selectedMonday = new EventEmitter<string>();
 
     constructor() {
     }
@@ -122,7 +122,7 @@ export class DatepickerComponent implements OnInit {
      */
     handleDateChange(): void {
         let mondayDate = this.findMondayInWeek(this.selectedYear, this.selectedMonth, this.selectedDay);
-        this.selectedMonday = mondayDate;
+        this.selectedMonday.emit(mondayDate);
     }
 
     /**
diff --git a/Frontend/src/app/pages/landingpage/landingpage.component.html b/Frontend/src/app/pages/landingpage/landingpage.component.html
index 1f323c7..baac77d 100644
--- a/Frontend/src/app/pages/landingpage/landingpage.component.html
+++ b/Frontend/src/app/pages/landingpage/landingpage.component.html
@@ -1,6 +1,6 @@
 <header>
     <p>TINF19B4 RaPla Changes</p>
-    <app-datepicker></app-datepicker>
+    <app-datepicker (selectedMonday)="dateChangedFromPicker($event)"></app-datepicker>
 </header>
 <div id="content">
     Events: {{eventCount}}
diff --git a/Frontend/src/app/pages/landingpage/landingpage.component.ts b/Frontend/src/app/pages/landingpage/landingpage.component.ts
index ce70492..73ea543 100644
--- a/Frontend/src/app/pages/landingpage/landingpage.component.ts
+++ b/Frontend/src/app/pages/landingpage/landingpage.component.ts
@@ -11,19 +11,25 @@ export class LandingpageComponent implements OnInit {
     events: Event[] = [];
     eventCount: number = 0;
 
+    selectedDate: string = '';
+
     constructor(
         private apiService: ApiService
     ) {
     }
 
     ngOnInit(): void {
-        this.getEvents();
     }
 
     getEvents() {
-        this.apiService.getEvents('2021-10-04').subscribe(events => {
+        this.apiService.getEvents(this.selectedDate).subscribe(events => {
             this.events = events;
             this.eventCount = events.length;
         });
     }
+
+    dateChangedFromPicker(newDate: string) {
+        this.selectedDate = newDate;
+        this.getEvents();
+    }
 }