ОШИБКА TypeError: Невозможно прочитать свойство filter из undefined: в файле ts - PullRequest
Новая
       19

ОШИБКА TypeError: Невозможно прочитать свойство filter из undefined: в файле ts

0 голосов
/ 13 февраля 2020

Я новичок в angular пытался реализовать автозаполнение в моем проекте ... но каждый раз, когда я открывал форму, я получал следующую ошибку ... не смог ее разрешить, мой HTML код: 

<mat-form-field class="col-12 col-sm-6 ">
<mat-label class="padding">Item  Name</mat-label>
  <input matInput formControlName="itemName" [matAutocomplete]="auto" style="padding-left: 10px;" >
  <mat-autocomplete #auto="matAutocomplete">
     <mat-option *ngFor="let list of filteredOptions | async"  [value]="list.codename">
    {{list.codevalue}}
  </mat-option>
  </mat-autocomplete>

<mat-error *ngIf="getvalue.itemName.errors">{{getitemNameErrorMessage()}}</mat-error>

нет; "> ->

мой файл TS: 

  ngOnInit() {
this.formType = this.editRowData !== null ? 'Edit' : 'Add';
const inventoryId = this.editRowData !== null ? this.editRowData.id : '';
// const pid = this.editRowData !== null ? this.editRowData.

// for inventory dropdown
this.inventoryservice.getInvDropdown().subscribe(
  data => {
    this.brandList = data['brands'],
    this.categoryList = data['categories'];
    this.unitsList = data['units'];
    this.vendorList = data['vendors'];
    this.materialList = data['materials'];
  }
);
if (inventoryId) {
  // call service to get project details
  this.inventoryservice.getProjectInventory(inventoryId).subscribe(
    data => {
      this.project = data[0].projectId;
      this.formBuilderOnDemand(data[0]);
      this.hideImage = data[0].itemImage !== null ? true : false ;
      this.hideInvoice = data[0].invoiceImage !== null ? true : false ;
      this.showForm = true;
      this.filter();
    }
  );
// this.formBuilderOnDemand(res);
} else {
  this.formBuilderOnDemand(this.editRowData);
  this.showForm = true;

}} 

filter() {
this.filteredOptions = this.updateInventoryForm.get('itemName').valueChanges
  .pipe(
    startWith(''),
    map(value => this._filter(value))
  ); }
 private _filter(value: any): any[] {
const filterValue = value.toLowerCase(); // error line of code;
return this.materialList.filter(list =>list.codevalue.toLowerCase().includes(filterValue));}

1 Ответ

1 голос
/ 13 февраля 2020

Поскольку входящие данные были нулевыми, а метод фильтра ожидал данных, то это вызвало ошибку.

Вот рабочая реализация: 

filter() {
this.filteredOptions = this.updateInventoryForm.get('itemName').valueChanges
  .pipe(
    startWith(''),
    map(value => this._filter(value))
  ); }
 private _filter(value: any): any[] {
const filterValue = value.toLowerCase();
if(!this.materialList) return this.materialList; // <-- add this line
return this.materialList.filter(list =>list.codevalue.toLowerCase().includes(filterValue));}
...