Property 'combineLatest' does not exist on type 'typeof Observable'

Question

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 :)

Answer 1

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

import {combineLatest} from 'rxjs';
combineLatest([...yourObserableList]);