Dropdown provides a way to select an item from a collection of available options. To list out all possible options, we should use the SelectItem interface that defines label-value properties, and this list will bind to the options attribute. The two-way binding for selected items is defined through the model property. Let's display a list of countries in a dropdown for user input. A basic example of a dropdown with the list of options would be as follows:
<p-dropdown [options]="countries" [(ngModel)]="selectedCountry"
[styleClass]="dropdown-width" placeholder="Select a Country">
</p-dropdown>
The dropdown will be displayed with options as shown in the following screenshot:
The Dropdown component provides three event callbacks, such as onChange, onFocus, and onBlur. When the dropdown value changes, it gets the focus and looses the focus, respectively. There is a provision to...