ng-select displaying [object, object]

Question

I have an array of objects that includes an element with an object and I'm looking to display the name of the object on a selectable dropdown using ng-select. I can console log everything as expected, however when I try to display the data I am only able to show [object, object]. The correct number of objects.

HTML -

<ng-select 
  [searchable]="false"
  bindValue="id"
  bindLabel="medications.items"
  [items]="selected"
  [(ngModel)]="serviceUsersMedication">
</ng-select>

TS -

  onSelect({selected}) {
    this.selected = selected;
    const filteredMeds = this.selected.filter(item => {
    return item.medications;
  });

  this.serviceUsersMedication = filteredMeds.map(item => {
    return item.medications;
  });

  console.log('Selected:');
  console.log(this.selected);
}

Style no library name, and not even your data model.

user17740968
– user17740968

2022-06-17 10:46:57 +00:00
Commented Jun 17, 2022 at 10:46 — user17740968
– user17740968, Commented Jun 17, 2022 at 10:46

Charlie V · Accepted Answer · 2022-06-17 11:40:52Z

1

You're using the same variable for [items] (the collection ng-select uses to display the options) as for [(ngModel)] (used for storing/displaying the SELECTED (1) item).

You have to split this:

[items] should refer to the collection
[(ngModel]) should refer to your selected item.

Your ng-select should look like this:

<ng-select 
  [searchable]="false"
  bindValue="id"
  bindLabel="name"
  [items]="medications.items"
  [(ngModel)]="selected">
</ng-select>

Assuming you have a name attribute in the items array of medication, else change it to the attribute that makes sense to show.. selected is already containing the selected item, no need to filter for that.

Also assuming you're using ng-select from @ng-select/ng-select

edited Jun 17, 2022 at 11:40

answered Jun 17, 2022 at 11:20

Charlie V

1,0501 gold badge10 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

DZF Over a year ago

Thanks for that - I have changed the ngModel value, however the result is still and array of [object, object]

Collectives™ on Stack Overflow

ng-select displaying [object, object]

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related