Attendees Modal done

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

@@ -6,21 +6,24 @@
     <ion-label>Adicionar intervenientes</ion-label>
   </ion-button>
   <ion-toolbar>
-    <ion-segment [(ngModel)]="segment" (ionChange)="onSegmentChange()">
-      <ion-segment-button value="required">
+    <ion-segment [(ngModel)]="segment">
+      <ion-segment-button value="true">
         Necessários
       </ion-segment-button>
-      <ion-segment-button value="optional">
+      <ion-segment-button value="false">
         Opcionais
       </ion-segment-button>
     </ion-segment>
   </ion-toolbar>
 </ion-header>
 <ion-content>
-  <div [ngSwitch]="segment">
-    <ion-list>
+  <div [ngSwitch]="segment" *ngFor="let attendee of eventAttendees">
+    <ion-list *ngSwitchCase="attendee.IsRequired.toString()">
       <ion-item-sliding>
-        <ion-item lines="none" *ngFor="let attendee of showAttendees">
+        <ion-item-options side="end">
+          <ion-item-option color="danger" (click)="removeAttendee(attendee)">Delete</ion-item-option>
+        </ion-item-options>
+        <ion-item lines="none">
           <div class="div-item">
             <div class="div-up">
               <div class="div-content-attachment">
@@ -31,6 +34,23 @@
           </div>
         </ion-item>
       </ion-item-sliding>
+      <!-- <ion-item-sliding>
+        <ion-item-options side="end">
+          <ion-item-option color="danger" (click)="removeAttendee(attendee)">
+            Remover
+          </ion-item-option>
+        </ion-item-options>
+        <ion-item lines="none" *ngFor="let attendee of showAttendees">
+          <div class="div-item">
+            <div class="div-up">
+              <div class="div-content-attachment">
+                <h3>{{ attendee.Name }}</h3>
+                <p>{{ attendee.EmailAddress }}</p>
+              </div>
+            </div>
+          </div>
+        </ion-item>
+      </ion-item-sliding> -->
     </ion-list>
   </div>
 </ion-content>

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

@@ -12,9 +12,8 @@ import { AttendeeModalPage } from '../attendee-modal/attendee-modal.page';
 export class AttendeesPage implements OnInit {
 
   eventAttendees: EventPerson[];
-  segment:string = "required";
+  segment:string = "true";
   shouldShowCancel:boolean = true;
-  showAttendees: EventPerson[];
 
   searchCountryString = ''; // initialize your searchCountryString string empty
 
@@ -24,18 +23,6 @@ export class AttendeesPage implements OnInit {
 
 
   ngOnInit() {
-    this.loadAttendees();
-  }
-
-  onSegmentChange(){
-    this.loadAttendees();
-  }
-
-  loadAttendees(){
-    let isrequired: boolean = (this.segment == "required");
-    this.showAttendees = this.eventAttendees.filter(function(person) {
-      return person.IsRequired == isrequired;
-    });
   }
 
   save(){
@@ -45,6 +32,15 @@ export class AttendeesPage implements OnInit {
   close(){
     this.modalCtrl.dismiss(null);
   }
+
+  removeAttendee(attendee: EventPerson)
+  {
+    let index: number = this.eventAttendees.findIndex((att) => {
+      return att.EmailAddress == attendee.EmailAddress
+    });
+
+    this.eventAttendees.splice(index, 1);
+  }
   
   async addAttendees()
   {
@@ -68,10 +64,13 @@ export class AttendeesPage implements OnInit {
           let att = {
             "EmailAddress": newattendee.EmailAddress,
             "Name": newattendee.Name,
-            "IsRequired": (this.segment == "required")
+            "IsRequired": (this.segment == "true")
           };
+          if (this.eventAttendees == null)
+          {
+            this.eventAttendees = new Array();
+          }
           this.eventAttendees.push(att);
-          this.showAttendees.push(att);
         });
       }
     });