Reputation: 45
I am trying to clean my code and make from more functions, one function. But I need to pass two arrays as a parameter and one string. The function is working correctly, but an array, I am passing in the parameter, is not updating in class.
This is my class in typescript, commented code in function onCompanyRenterNameChanged is working, but the new code below the comment, is not working and after the run, it does not update filteredListOfRenters, I am passing as a parameter. It still returns full list, not filtered, but I have no idea why.
export class FilterDialogComponent implements OnInit {
filteredListOfRenters: Company[];
filteredListOfStatuses: Status[];
filteredListOfCars: Car[];
constructor(...) {
}
ngOnInit() {
this.fillFilteredListsOnInit();
this.selectValueInControl();
}
confirmFilter(data): void {
data.renterId = this.filterFormGroup.get('renterControl').value;
data.statusId = this.filterFormGroup.get('statusControl').value;
data.carId = this.filterFormGroup.get('carControl').value;
this.dialogRef.close({
data
});
}
onCompanyRenterNameChanged(value: string) {
//this.fillFilteredListOfRenterCompanies(value.toLowerCase());
this.fillFilteredList(this.codeListService.listOfRenters, this.filteredListOfRenters, value.toLowerCase());
}
onStatusChanged(value: string) {
this.fillFilteredListOfStatuses(value.toLowerCase());
}
onCarChanged(value: string) {
this.fillFilteredListOfCars(value.toLowerCase());
}
fillFilteredList(codeList: any[], filteredList: any[], filter: string){
if(codeList.length !== 0){
filteredList = codeList.filter((item) => {
if(item.name !== null){
return item.name.toLowerCase().startsWith(filter);
}
})
}
}
fillFilteredListOfRenterCompanies(filter: string) {
if (this.codeListService.listOfRenters.length !== 0) {
this.filteredListOfRenters = this.codeListService.listOfRenters.filter((item) => {
if (item.name !== null)
return item.name.toLowerCase().startsWith(filter);
});
}
}
fillFilteredListOfStatuses(filter: string) {
if (this.codeListService.statuses.length !== 0) {
this.filteredListOfStatuses = this.codeListService.statuses.filter((item) => {
if (item.name !== null)
return item.name.toLowerCase().startsWith(filter);
});
}
}
fillFilteredListOfCars(filter: string) {
if (this.codeListService.cars.length !== 0) {
this.filteredListOfCars = this.codeListService.cars.filter((item) => {
let carName = this.codeListService.getNameOfManufacturerById(item.manufacturerId) + " " + item.model + " " + item.ecv;
if (carName !== null)
return carName.toLowerCase().startsWith(filter);
});
}
}
fillFilteredListsOnInit(){
this.filteredListOfRenters = this.codeListService.listOfRenters;
this.filteredListOfStatuses = this.codeListService.statuses;
this.filteredListOfCars = this.codeListService.cars;
}
}
Upvotes: 3
Views: 27675
Reputation: 46
You're setting filteredList to a new array by assigning Array.filter to it. See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter.
What you want to do is return the new results from the function and assign them to the array variable
onCompanyRenterNameChanged(value: string) {
filteredArray = this.fillFilteredList(this.codeListService.listOfRenters,
this.filteredListOfRenters, value.toLowerCase());
}
fillFilteredList(codeList: any[], filteredList: any[], filter: string){
if(codeList.length !== 0){
return codeList.filter((item) => {
if(item.name !== null){
return item.name.toLowerCase().startsWith(filter);
}
})
}
else {
return [];
}
}
Upvotes: 3
Reputation: 7650
You should return result.
update code as below:
fillFilteredList(codeList: any[], filteredList: any[], filter: string){
if(codeList.length !== 0){
filteredList = codeList.filter((item) => {
if(item.name !== null){
return item.name.toLowerCase().startsWith(filter);
}
});
return filteredList
}
return []
}
Upvotes: 1