autocomplete with array of object


Topic: autocomplete with array of object

luqeckr pro premium asked 6 months ago

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


Damian Gemza staff answered 6 months ago

Dear luqeckr,

There's no such possibility to use the [value] input with tho different fields from your object.

This input is used to bind the selected value with the autocompleter's input field.

If you want to find the id of selected item, you can use the ES6 Array.find() method.

this.completer.selectedItemChanged().subscribe((data: any) => {
      console.log(this.data.find((el: any) => el.name == data.text).id);
    });

Best Regards,

Damian


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: Angular
  • MDB Version: 7.4.2
  • Device: laptop
  • Browser: Chrome
  • OS: Ubuntu
  • Provided sample code: No
  • Provided link: No