Antiguamente Tenía esta funcionalidad:
<div class="row">
<label class="control-label col-md-3">Aplicación:</label>
<div class="col-md-9" class="visorg500-select-filter">
<select [(ngModel)]="varApps">
<option *ngFor="let valorApp of listApps" [value]="valorApp.id">
{{valorApp.label}}
</option>
</select>
</div>
</div>
del lado de typeScript
:
private LoadApps(): void {
this.listApps = [
{ id: 1, label: 'PREMIER' },
{ id: 2, label: 'G500 FLEET' }
];
this.varApps = this.listApps[0].id;
}
lo cuál me seleccionaba y me permitía cachar en la "varApps" el id cuando se realizaba el cambio.
Por cuestiones de Diseño y de presentación implementé lo siguiente:
<div class="row">
<label class="control-label col-md-3">Aplicación:</label>
<div class="col-md-9">
<p-dropdown class="visorg500-select-filter" [options]="listApps" filter="true"
[style]="{'width':'70%'}">
<select [(ngModel)]="varApps">
<option *ngFor="let valorApp of listApps" [value]="valorApp.id">
{{valorApp.label}}
</option>
</select>
</p-dropdown>
</div>
</div>
El punto es que ya no me permite, tomar el id producido por el evento del cambio.
Me supongo que por el uso de (p-dropdown), pero hasta ahora no he podido conseguir lo que busco.
Agradeceré si alguien pueda apoyarme, con alguna orientación, Saludos...