У меня есть экран поиска, который ищет в коллекции пользователей Firebase подходящие displayNames. Но я хотел бы вернуть список, основанный на первых буквах по мере их ввода.
Например, у вас есть Джон, Джонни, Джек.
При наборе J появляются все три. Когда вы набираете 'Jo', появляются только первые два.
Вот мой код, который работает, но работает только при наборе всего DisplayName
search(event) {
console.log('event', event.target.value);
let searchKey: string = event.target.value;
console.log('searchKey', searchKey);
let firstLetter = searchKey;
console.log('firstLetter', firstLetter);
if (searchKey.length === 0) {
this.sampleArr = [];
this.resultArr = [];
}
if (this.sampleArr.length === 0) {
this.afs.collection('users', ref => ref.where('displayName', '==', firstLetter))
.snapshotChanges().subscribe(data => {
data.forEach(childData => {
this.sampleArr.push(childData.payload.doc.data());
});
});
}
}
<ion-content padding>
<ion-searchbar (ionInput)="search($event)"></ion-searchbar>
<ion-item *ngFor="let user of sampleArr" (click)="sendUserRequest(user)">
<ion-avatar style="padding-right: 10px;">
<img [src]="user.profilePic" alt="" srcset="">
</ion-avatar>
<ion-label>
<ion-note style="font-weight:bold; color: black;">
Send request to
</ion-note>
<ion-note style="font-weight:bold; color: black;">
{{user?.displayName}}
</ion-note>
</ion-label>
</ion-item>
</ion-content>