Getting p-dropdown option value from selected item with primeng and angular

user_16173689 0
Viewed 1832

I face a problem when trying to send selected item value, when iterating over an array of strings like : ("BMW", "FERRARI", "AUDI","BENTLY")

here is my HTML

 <p-dropdown optionLabel="type" [options]="cars" formControlName="name"
        editable="true" optionLabel="" optionValue="" (onChange)="loadCarsByName(name)">
 </p-dropdown>

The value passed in my loadCarsByName method is undefined any ideas will be welcomed.

primeng angular typescript html
1 Answers

Try adding your dropdown values in label and values

carsNames =[
{label:'BMW', value:'BMW'},
{label:'FERRARI', value:'FERRARI'},
{label:'AUDI', value:'AUDI'},
];

or

carss: string[] = ['BMW', 'FERRARI', 'AUDI', 'BENTLEY'];

selectedPort="";

storeValue(event) {
    console.log(event); //event.value will likely be undefined, check event.originalEvent
    this.selectedPort = event.originalEvent.srcElement.innerText;
}

<p-dropdown [options]="cars" [(ngModel)]="selectedCity1" placeholder="Select a City"  (onChange)="storeValue($event)">
    <ng-template let-item pTemplate="selectedItem"> 
    {{item}} 
  </ng-template> 
  <ng-template let-item pTemplate="item"> 
    {{item}}
  </ng-template>
</p-dropdown>
user_162345940
Related