How to abort a request?

Question

Angular

I use ng-select, following the example from the docs ( Demo, bottom example ), I did a search through the backend:

private loadCountry() {
        this.countryList$ = concat(
            of([]), // default items
            this.countryInput$.pipe(
                debounceTime(this.debounceTime),
                distinctUntilChanged(),
                tap(() => this.countryLoading = true),
                switchMap(search => {
                    return this.locationService.getCountry(search).pipe(
                        catchError(() => of([])),  // empty list on error
                        tap(() => this.countryLoading = false)
                    ).toPromise().then(data => {
                        const countries = [];
                        const cnt = data.body.length;
                        for (let i = 0; i < cnt; i++) {
                            countries.push(new Country(data.body[i]));
                        }
                        return countries;
                    });
                }),
            )
        );
    }

But there is a problem: after the user selects the desired item in the select, this method will work again, but with search = null. Here's how to avoid it. What is the right way to abort the execution of this method when search = null?
I did this, but it seems to me that this is not technically correct, and there are more correct solutions.

private loadCountry() {
        this.countryList$ = concat(
            of([]), // default items
            this.countryInput$.pipe(
                debounceTime(this.debounceTime),
                distinctUntilChanged(),
                tap(() => this.countryLoading = true),
                switchMap(search => {
                    
                    if (!search) {this.countryLoading = false; return []; }  // Мое решение
                    
                    return this.locationService.getCountry(search).pipe(
                        catchError(() => of([])), // empty list on error
                        tap(() => this.countryLoading = false)
                    ).toPromise().then(data => {
                        const countries = [];
                        const cnt = data.body.length;
                        for (let i = 0; i < cnt; i++) {
                            countries.push(new Country(data.body[i]));
                        }
                        return countries;
                    });
                }),
            )
        );
    }

Answer 1

In the pipe, use the filter rxjs operator and filter out null values.
https://www.learnrxjs.io/operators/filtering/filte...

Answer 2

And in the example, the input parameter [minTermLength]="2"does not tell you anything?
and remove the promise, it's a nightmare