Expected behavior I need to capture the selected element from the autocomplete, however, when I select an item from the autcompleter the selected event is not triggered.

HTML Code

 <div class="md-form">
                  <input
                    type="text"
                    class="completer-input form-control mdb-autocomplete"
                    [ngModel]="searchText | async"
                    (ngModelChange)="searchText.next($event)"
                    [ngModelOptions]="{standalone: true}"
                    [mdbAutoCompleter]="auto"
                    (select)="onCountrySelect($event)"
                    placeholder="Choose your country"
                  />
                  <mdb-auto-completer #auto="mdbAutoCompleter" textNoResults="I have found no results :(">
                    <mdb-option *ngFor="let option of results | async" [value]="option">
                      {{ option }}
                    </mdb-option>
                  </mdb-auto-completer>
                </div>

TS Code

  searchText = new Subject();
  results: Observable<string[]>;
  countries: any[];

ngOnInit() {
    this.results = this.searchText.pipe(
      startWith(''),
      map((value: string) => this.filter(value))
    );
  }

//to filter the names of the countries
  filter(value: string): string[] {
    const filterValue = value.toLowerCase();
    const countryNames = this.countries.map(item => item.name);
    const returnValue = countryNames.filter((item:any) => item.toLowerCase().includes(filterValue));
    return returnValue;
  }

  //gets  country selected
  onCountrySelect(event){
    console.log(event);
  }