Угловая поисковая панель для Firestore

Question

Я пытаюсь создать панель поиска для запроса данных из Firestore и показать результаты в виде списка.Для этого я создал следующее:

export class SearchComponentComponent implements OnInit  {


ngOnInit(): void {

}
searchValue: string = "";
results: any;

 constructor(public afs: AngularFirestore) {
 }

 search() {
  let self = this;
   self.results = self.afs.collection(`Blogs`, ref => ref
  .orderBy("title")
  .startAt(self.searchValue.toLowerCase())
  .endAt(self.searchValue.toLowerCase()+"\uf8ff")
  .limit(10))
  .valueChanges();
 }

 }

и мой HTML:

<div>
 <input type="text" (keyup)="search()" [(ngModel)]="searchValue"  
placeholder="search 
 movies..." >
<div class="search-results">
 <div class="search-result" *ngFor="let result of results | async">
  {{ result.title }}
</div>

Проблема в том, что я не получаю никаких данных.Один ребенок в блоге содержит следующие данные:

Заголовок, тело, изображение

Я хочу показать заголовок в своем списке результатов

Answer 1

я нашел решение:

import { Component, OnInit } from '@angular/core';
import { AngularFirestore } from 'angularfire2/firestore';

@Component({
selector: 'app-search-component',
templateUrl: './search-component.component.html',
styleUrls: ['./search-component.component.css']
})
export class SearchComponentComponent implements OnInit  {

 displayedColumns = ['ImageUrl'];

 ngOnInit(): void {
}
 searchValue: string = "";
 dataSource: any;

 constructor(public afs: AngularFirestore) {
 }





 getStudents() {
this.dataSource = this.afs.collection('Blogs', ref => ref.where('title', '==', this.searchValue)).valueChanges();
}

}