I am currently working on a list filtering feature that updates based on user input. As the user types, the system compares the entered text against the items in the list and displays the matching objects in an array. However, I'm facing an issue - when the search field is empty, the original, unfiltered list should be shown instead of the last successful search result.
HTML
<input type="text" class="in-line filter" id="searchByName" placeholder="Enter a name" (keyup)="filterByName($event.target.value)" />
<study-results-table [originalArray]="originalArray"></study-results-table>
TS
ngOnInit(){
originalArray = new Array<any>();
unfiltered = new Array<any>()
}
filterByName(searchString){
this.filtered = new Array<any>();
_.each(this.originalArray, (result) => {
let name = result.firstName.toLowerCase() +" " +result.lastName.toLowerCase();
if(patientName.includes(searchString.toLowerCase())){
this.filtered.push(result);
}
})
if(searchString === ""){
this.originalArray= this.unfiltered;
}
this.originalArray= this.filtered;
}
Can anyone provide guidance on resolving this issue?