TypeError: Cannot read properties of undefined (reading 'length') at _AngularMultiSelect.onItemClick

[ara-chinaryan]

I installed angular2-multiselect-dropdown. Everything went well. But when I want to select some value I get this error.

`<angular2-multiselect [data]="dropdownList" [settings]="dropdownSettings" (onSelect)="onItemSelect($event)" (onDeSelect)="OnItemDeSelect($event)" (onSelectAll)="onSelectAll($event)" (onDeSelectAll)="onDeSelectAll($event)">

`

`import {Component, OnInit} from '@angular/core';

@Component({ selector: 'app-login', templateUrl: './login.component.html', styleUrl: './login.component.css' }) export class LoginComponent implements OnInit{ dropdownList: any = []; selectedItems: any = []; dropdownSettings = {};

ngOnInit(){ this.dropdownList = [ {"id":1,"itemName":"India"}, {"id":2,"itemName":"Singapore"}, {"id":3,"itemName":"Australia"}, {"id":4,"itemName":"Canada"}, {"id":5,"itemName":"South Korea"}, {"id":6,"itemName":"Germany"}, {"id":7,"itemName":"France"}, {"id":8,"itemName":"Russia"}, {"id":9,"itemName":"Italy"}, {"id":10,"itemName":"Sweden"} ]; this.selectedItems = [ {"id":2,"itemName":"Singapore"}, {"id":3,"itemName":"Australia"}, {"id":4,"itemName":"Canada"}, {"id":5,"itemName":"South Korea"} ]; this.dropdownSettings = { singleSelection: false, text:"Select Countries", selectAllText:'Select All', unSelectAllText:'UnSelect All', enableSearchFilter: true, classes:"myclass custom-class" }; } onItemSelect(item:any){ console.log(item); console.log(this.selectedItems); } OnItemDeSelect(item:any){ console.log(item); console.log(this.selectedItems); } onSelectAll(items: any){ console.log(items); } onDeSelectAll(items: any){ console.log(items); } }`

{ "name": "ngrx-safeyou", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "watch": "ng build --watch --configuration development", "test": "ng test" }, "private": true, "dependencies": { "@angular/animations": "^18.1.0", "@angular/common": "^18.1.0", "@angular/compiler": "^18.1.0", "@angular/core": "^18.1.0", "@angular/forms": "^18.1.0", "@angular/platform-browser": "^18.1.0", "@angular/platform-browser-dynamic": "^18.1.0", "@angular/router": "^18.1.0", "angular2-multiselect-dropdown": "^10.0.0", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.14.3" }, "devDependencies": { "@angular-devkit/build-angular": "^18.1.2", "@angular/cli": "^18.1.2", "@angular/compiler-cli": "^18.1.0", "@types/jasmine": "~5.1.0", "jasmine-core": "~5.1.0", "karma": "~6.4.0", "karma-chrome-launcher": "~3.2.0", "karma-coverage": "~2.2.0", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.1.0", "typescript": "~5.5.2" } }