Ошибки при фильтрации списка Firebase с помощью панели поиска - PullRequest
Новая
       8

Ошибки при фильтрации списка Firebase с помощью панели поиска

0 голосов
/ 14 января 2019

У меня есть ion-list, который содержит данные из магазина. Я пытаюсь найти данные в этом списке, однако я не могу отфильтровать свой список элементов из-за неопределенной ошибки: Cannot read property 'toLowerCase' of undefined Поскольку я новичок в ionic, я не совсем уверен, по каким данным я должен фильтровать.

home.html 

<ion-content padding>
<ion-searchbar placeholder="Filter Items" (ionInput)="filterItems($event)</ion-searchbar>
<ion-list>
<ion-item text-wrap *ngFor='let user of users'>
  <h2><strong>{{ user.name }}</strong></h2>
  <h5><strong>Phone:</strong> {{ user.phone}}</h5>
  <h5><strong>Address:</strong> {{ user.street}}, {{ user.suburb}}, {{ user.city}} {{ user.postcode}}</h5>

  <button ion-button color='secondary' (click)='updateDocument(user)'>Update this record</button>
    </ion-item>
     </ion-list>
</ion-content>

home.ts 

private _COLL   : string = "users";
private _CONTENT    : any;
public users        : any;

constructor(public navCtrl  : NavController,
           private _DB     : DatabaseProvider,
           private _ALERT  : AlertController)
{
  this._CONTENT = {
     id          : "",
     name        : "",
     phone       : "",
     street      : "",
     suburb      : "",
     city        : "",
     postcode    : ""
  };
}

ionViewDidEnter()
{
  this.retrieveCollection();
}

retrieveCollection() : void
{
  this._DB.getDocuments(this._COLL)
  .then((data) =>
  {
     this.users = data;
  })
  .catch();
}

filterItems(ev: any) {
  debugger;
  this.retrieveCollection();
  let val = ev.target.value;

  if (val && val.trim() !== '') {
    this.users.filter(function(user) {
      return user.name.toLowerCase().includes(val.toLowerCase());
    });
  }
}

Похоже, что это function(user) внутри filterItems(), которое не определено, но я не уверен, что я должен был здесь поставить. Я хотел бы фильтровать на основе пользователей name

1 Ответ

0 голосов
/ 15 января 2019

Проверьте, правильно ли сформирован ваш массив users. Я вижу ошибку в вашем HTML. ion-searchbar неправильно закрывается. 

<ion-searchbar placeholder="Filter Items" (ionInput)="filterItems($event)"> 
</ion-searchbar>

См. Мою демонстрацию стекабликов здесь.

...