doneit-web/src/app/pages/search/sender/sender.page.ts

import { Component, OnInit } from '@angular/core';
import { ModalController } from '@ionic/angular';
import { ContactsService } from 'src/app/services/contacts.service';
import { EventPerson } from  'src/app/models/eventperson.model';
import { ThemeService } from 'src/app/services/theme.service'

@Component({
  selector: 'app-sender',
  templateUrl: './sender.page.html',
  styleUrls:
   ['./sender.page.scss'],
})
export class SenderPage implements OnInit {

  contacts: EventPerson[];
  showContacts: EventPerson[];
  sender: string;
  selectedUser: string;

  constructor(private modalController:ModalController,
    private ContactsService: ContactsService,
    public ThemeService: ThemeService) { 

    }

  ngOnInit() {
    this.getSender();
  }

  getSender(){
    this.ContactsService.getContacts("").subscribe(res=>{
      this.contacts = res;
      this.showContacts = res
    });
  }
  
  filterContact(event?:any){

    const findPerson = this.sender.toLowerCase();
    const persons = this.contacts.filter((person) => {

      if (person.Name.toLowerCase().indexOf(findPerson) == 0){
       return true;
      }

    });

    this.showContacts = persons;
  }

  selectUser(username){
    this.selectedUser = username;
    this.close(this.selectedUser);
  }

  close(username?: string){
    this.modalController.dismiss(username);
  }

}