I am currently encountering an issue while populating a form that contains several PrimeNg dropdowns. To simplify, let's consider an example similar to the ones provided on their website.
<form [formGroup]="myFormGroup">
<p-dropdown [options]="cities" formControlName="selectedCity"></p-dropdown>
</form>
this.cities = [
{name: 'New York', code: 'NY'},
{name: 'Rome', code: 'RM'},
{name: 'London', code: 'LDN'},
{name: 'Istanbul', code: 'IST'},
{name: 'Paris', code: 'PRS'}
];
For instance, if a user selects a row from a table for editing, corresponding to a complex object with a City property, we need to programmatically select, let's say Rome, in that dropdown on the form.
I have attempted:
this.myFormGroup.get("selectedCity").setValue('Rome');
also tried:
this.myFormGroup.get("selectedCity").patchValue('Rome');
and even added to the html:
optionLabel="name"
However, nothing seems to be getting selected. Any suggestions on how to tackle this issue efficiently?
I believe I should refrain from adding
[(ngModel)]="selectedCity"
instead, do:
this.selectedCity='Rome';
Using Angular6 and PrimeNG 6.1.2.