Question

我正在尝试清除我的代码，并使用更多的功能（一个功能）制作代码。但是我需要传递两个数组作为参数和一个字符串。该函数正常运行，但是我在传递参数的数组未在类中更新。

这是我在打字稿中的类，函数onCompanyRenterNameChanged中的带注释的代码正在工作，但是注释下方的新代码不起作用，运行后，它不更新filteredListOfRenters，我作为参数传递。它仍然返回完整列表，未过滤，但我不知道为什么。

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;
  }
}

Answer 1

您应该返回结果。

更新代码如下：

  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 []
  }

Answer 2

您正在通过将Array.filter分配给它来将filteredList设置为一个新数组。参见https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter。

您要做的是从函数中返回新结果并将其分配给数组变量

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 [];
    }
 }

打字稿：将数组作为参数传递

2 个答案: