autocomplete with array of object


Topic: autocomplete with array of object

luqeckr free asked 3 years 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 3 years 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.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

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