I have a p-dropdown that displays a list of select items that are generated in the component. If I place the p-dropdown on the page as just a static input then it renders the list of the select items without issue.
The intention is to include the p-dropdown in a row of cells. So that rows can be added that contain the p-dropdown, or removed. This is rendered with an ngFor loop. So I have an array of object, one of the object properties is a selected value of the p-dropdown.
If I start with an empty array, so the p-dropdown is not rendendered on the page, and then add an empty object to the ngFor array, this renders the p-dropdown in the row, there are no values in the p-dropdown. If just shows the select box and the place holder with no values to select from.
Why are the options not rendered when the p-dropdown is a part of an ngFor? How can I do this?
Turns out it was the class on the div that represented the row that has an overflow:hidden applied. So the list was populated just not shown.