Search code examples
javascriptangularangular5dropdownngx-select-dropdown

how to pass data in form of array of objects?


I am using the package ngx select dropdown in my angular 5 project and wanted to know how I pass an array of objects instead of an array of strings. Currently, If I am doing so it's showing [Object Object] as options in the dropdown.

data=[ {
        "id": "ab",
        "description": "аҧсуа"
    },
    {
        "id": "aa",
        "description": "Afaraf"
    },
    {
        "id": "af",
        "description": "Afrikaans"
    },
    {
        "id": "ak",
        "description": "Akan"
    }]
 <ngx-select-dropdown [config]="config" [options]="data" [(ngModel)]="datasel" [multiple]="false">
 </ngx-select-dropdown>
/** ngx-select-dropdown config */
    public config: any = {
        search: true,
        height: '260px',
        placeholder: 'Select',
        customComparator: () => { },
        limitTo: 10,
        moreText: 'more',
        noResultsFound: 'No results found!',
        searchPlaceholder: 'Search',
        searchOnKey: ''
    }

and I want to display description to users in dropdown and on select get id of the selected option.


Solution

  • I have found an answer to the question myself. config.displaykey was missing, adding that key according to the requirement made it work.

    /** ngx-select-dropdown config */
    public config: any = {
        displayKey: "description",
        search: true,
        height: '260px',
        placeholder: 'Select',
        customComparator: () => { },
        limitTo: 10,
        moreText: 'more',
        noResultsFound: 'No results found!',
        searchPlaceholder: 'Search',
        searchOnKey: ''
    }