ng-multiselect-dropdown - TypeError: Cannot read property 'idField' of undefined

Question

Followed steps as per https://www.npmjs.com/package/ng-multiselect-dropdown for angular 9

received below error in browser console

TypeError: Cannot read property 'idField' of undefined

Answer 1

I had the same issue and I solved but moving [settings] param prior to [data] para.

Example:

    <ng-multiselect-dropdown
        [settings]="dropdownSettings"
        [data]="dropdownList"
        [(ngModel)]="selectedItems"
    >
    </ng-multiselect-dropdown>

Answer 2

Please set

dropdownSettings:IDropdownSettings = {
..Other settings,
idField: 'id',
textField: 'text'};

set your dropdown list as

dropdownList= [{id: '1', text: 'Sample Text'}, ..]

Also set [settings] before [data] in html as indicated by Abraham Cm

Answer 3

yes, solution above (with [settings] binding before [data]) works because ng-multiselect-dropdown has setters in data and settings inputs. data setter is using settings input. So in this case order is important. It also suprised me at the beginning. Look at source code: