Hi , I'm facing the same problem , but only on mobile devices , works like a charm for desktop. for mobile browser the input looses focus after the http call .

    <mdb-option *ngFor="let article of results | async" [value]="article.articleName">
      <div class="row p-2">
        <div class="col-2"><img width="40" height="40" [src]="article.resourceUrl"></div>
        <div [class]="'col-8 text-justify ' ">
          <a
            [routerLink]="['/fpub/products/product/',article.id]"
            href=""
            (click)="hideResults()">
            <label >{{article.articleName}}
            </label>
          </a>
        </div>
      </div>
    </mdb-option>
  </mdb-auto-completer>

  searchText = new Subject();

ngOnInit() {
this.searchText.pipe(
      startWith(''),
      map((value: string) => this.filter(value))
    ).subscribe(r => {
      this.results = r;
      // this.txtSeachArticleM?.nativeElement?.focus();
    });
}

 filter(value: string): Observable<Article[]> {  
       const filterValue = value.toLowerCase();



  if (filterValue && filterValue !== ' ' ) {
     this.eventsTrackingService.searchEvent(filterValue.trim());
     return this.articleService.searchArticles(filterValue.trim()); // the API Call
   } else {
     return Observable.empty();
   }
 }


}