primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.58k stars 4.61k forks source link

p-dropdown: setting style="width:100%" doesn't bind to model #14857

Open ksmit opened 9 months ago

ksmit commented 9 months ago

Describe the bug

p-dropdown doesn't bind to the property specified in ngModel when style="width:100%" is specified.
[ngStyle] is working as intended.

Environment

Reproducer

https://stackblitz.com/edit/github-ey2joz

Angular version

17.1x

PrimeNG version

17.7.x

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v18.19.0

Browser(s)

No response

Steps to reproduce the behavior

  1. Change value of Dropdown 2

Expected behavior

Value should change from Selected Value Dropdown 2 : 0

to selected value eg. Selected Value Dropdown 2 : 1

dalenguyen commented 8 months ago

It dues to the fact that p-dropdown has its own style Input that receives an object then passes to ngStyle.

@Input() style: { [klass: string]: any } | null | undefined;

...

[ngStyle]="style"

You can try this one.

  <p-dropdown
    [style]="{ display: 'block', width: '100px' }"
    [options]="options"
    [(ngModel)]="selectedOne"
  />