Attendees funcionality.

src/app/pages/events/attendees/attendees.page.ts

@@ -1,7 +1,5 @@
-import { Component, OnInit, Injectable } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { EventPerson } from 'src/app/models/eventperson.model';
-import { ActivatedRoute } from '@angular/router';
-import { EventDetailPage } from '../event-detail/event-detail.page';
 import { EventsService } from 'src/app/services/events.service';
 
 @Component({
@@ -11,18 +9,54 @@ import { EventsService } from 'src/app/services/events.service';
 })
 export class AttendeesPage implements OnInit {
 
+  eventAttendeesInitial: EventPerson[];
   eventAttendees: EventPerson[];
-  segment:string;
+  segment:string = "required";
+  shouldShowCancel:boolean = true;
 
-  constructor(private activatedRoute: ActivatedRoute, public eventService: EventsService) { 
+  searchCountryString = ''; // initialize your searchCountryString string empty
+
+  constructor(private eventService: EventsService) { 
   }
 
+
   ngOnInit() {
-    this.eventAttendees = this.eventService.loadedEvent.Attendees;
-    console.log(this.eventService.loadedEvent);
+    this.loadAttendees();
   }
 
   onSegmentChange(){
-    
+    this.loadAttendees();
+  }
+
+  searchCountry(searchbar) {
+    // reset countries list with initial call
+    this.eventAttendees = this.eventAttendeesInitial;
+
+    // set q to the value of the searchbar
+    var q = searchbar.value;
+
+    // if the value is an empty string don't filter the items
+    // if (q.trim() == '') {
+    //     return;
+    // }
+
+    this.eventAttendees = this.eventAttendees.filter((v) => {
+        if (v.Name.toLowerCase().indexOf(q.toLowerCase()) > -1) {
+            return true;
+        }
+        return false;
+    })
+  }
+
+  loadAttendees(){
+    let isRequired: boolean = (this.segment == "required");
+    this.eventAttendees = this.eventService.lastloadedevent.Attendees.filter(function(person) {
+      return person.IsRequired == isRequired;
+    });
+    this.eventAttendeesInitial = this.eventAttendees;
+  }
+
+  onChange(evt: any) {
+    console.log(evt);  
   }
 }