0

Im trying to add a InstantSearch Function into my website. Im using Angular 12.2 and working with a firestore database with the index "book-data". Im using the following code in my search component:

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

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

  startAt = new Subject();
  endAt = new Subject();

  titel;

  startobs = this.startAt.asObservable();
  endobs = this.endAt.asObservable();

  constructor(private afs: AngularFirestore) {}

  ngOnInit() {
    Observable.combineLatest(this.startobs, this.endobs).subscribe((value) => {
      this.firequery(value[0], value[1]).subscribe((titel) => {
        this.titel = titel;
      });
    });
  }

  search($event) {
    let q = $event.target.value;
    this.startAt.next(q);
    this.endAt.next(q + '\uf8ff');
  }

  firequery(start, end) {
    return this.afs
      .collection('book-data', (ref) =>
        ref.limit(4).orderBy('auflage').startAt(start).endAt(end)
      )
      .valueChanges();
  }
}

I imported the Subject and Observable from Rxjs, also in the app-module.ts. I also tried to get combineLatest from rxjs/Rx and installed rxjs-compat, but whenever I do this, the combineLatest element in the code gets struck through and i cant start angular with ng serve --open anymore.

Im thankful for any further suggestions :)

ReaxonTV
  • 1

1 Answers1

1

I use combineLatest as standalone function in my code. Maybe you should use it like this :

import {combineLatest} from 'rxjs';
combineLatest([...yourObserableList]);
Cyril
  • 13
  • 4
  • Thanks for the fast response. Unfortunately I still get the same error. Maybe it could be an issue, that I cant list "combineLatest" in the app.module.ts as an import under NgModule... But i dont know how to fix that either... – ReaxonTV Apr 29 '22 at 12:54
  • What is your RxJS version ? Maybe it is outdated... Also, I had some troubles when I migrated from version 6 to version 7: I had to replace all occurences of 'rxjs/operators/' by 'rxjs/operators' (without the last slash). I tell you that because my errors talked about rxjs-compat too... – Cyril Apr 29 '22 at 13:05
  • It is 6.5.3. Unfortunately the help with the / didnt help. Im gonna ask this week a mate of mine who is familiar with angular, maybe I get a solution and then I will post it here. – ReaxonTV May 01 '22 at 11:58