is it possible to use object with autocomplete? i commonly use object.id as a value and object.name as options object.id is usually represent the id of data

<mdb-option *ngFor="let option of productList" [value]="option.id">
          <strong>{{option.name}}</strong>
</mdb-option>

when i choose one of the option, the input box shows the "id". My expectation is it should show the name instead. And when i send the form, i expect it to send the id only.

currently with the code above, the input box only show the id of the choosen data.

i try subscribing to this code

this.completer.selectedItemChanged().subscribe((data: any)

but it only return data.text which is contain only the value of selected option.id