ERROR TypeError: Cannot read properties of undefined (reading 'phones')

Question

我有一个问题，我收到错误“core.js:4196 错误类型错误：无法读取未定义的属性（读取 'phones'）”

问题是它告诉我我正在检查的对象数组是空的，当我稍微检查并进行调试时，我意识到它不是。这实际上不会无限期地到来，数据很大，是的，在 2800 条数据中，它带给你将近 5 或 6 phones（因为这些是注册的）

无论如何，我真正想做的是从一个对象中获取 phone 个“x”个用户，然后对数据进行自动完成过滤。

我把代码留给你，也许你看到了我没有看到的东西：

.TS

  contactos: AddContacto[] = [];
  filteredContacts: Observable<AddContacto[]>;
  phoneControl: FormControl = new FormControl();

 this.filteredContactos = this.phoneControl.valueChanges.pipe(
      startWith(null),
      map((search: string | null) => (search ? this._filterContactos(search) : this.contactos.slice())),
    );

private _filterContactos(search: string) {
    const filterValue = search.toLowerCase();
    return this.contact.filter(
      (contact) =>
        !!contact.phones.find((email) => contact.includes(search)) ||
        contact.fullName.toLowerCase().includes(filterValue),
    );
  }

.HTML

<div class="containerTitle p-16">

                <mat-form-field fxFlex="100" class="mr-12" appearance="outline" fxFlex="100">
                    <mat-label>Search Client</mat-label>
                    <input type="text" placeholder="Add email..." matInput [formControl]="phoneControl" [matAutocomplete]="auto">
                    <mat-autocomplete #auto="matAutocomplete" >
                        <mat-option *ngFor="contact of filteredContacts | async" [value]="contact.phones[0]">
                            {{contact?.phones[0]}} {{contact?.fullName ? '('+ contacto?.nombre_completo +')' : ''}}
                        </mat-option>
                    </mat-autocomplete>
                </mat-form-field>
                <small-loading class="loadingProgressBar" [loading]="loading"></small-loading>
            </div>

对象

0: {
    "state": true,
    "coments": null,
    "phones": ["22222222"],
    "emails": [
        "email@gmail.com"
    ],
    "fullName": "",
    "_id": "",
    "bitacora": {},
    "__v": 0
}

谢谢！！

Answer 1

该错误是因为您使用的是旧版本的打字稿，需要检查数组是否存在以及长度是否大于 0 才能使用任何数组方法，如 filter、find、foreach 等

在您的 _filterContactos 方法中更改它。

private _filterContactos(search: string) {
    const filterValue = search.toLowerCase();
    return this.contact.filter(
      (contact) => {
        if (contact.phones && contact.phones.length > 0) {
          !!contact.phones.find((email) => contact.includes(search)) ||
           contact.fullName.toLowerCase().includes(filterValue)
        }
      }
        
    );
  }

让我知道它是否适合你。

ERROR TypeError: Cannot read properties of undefined (reading 'phones')

ERROR TypeError: Cannot read properties of undefined (reading 'phones')

javascript

filter

observable

typescript

angular