How can I pass the selected value from p-dropdown to ts?


This is an example of code for p-dropdown.

// product.component.html
    placeholder="Select a product"

This is json data I am getting from API. In the p-dropdown, the productName is successfully shown.

// products data
        productName: "Apple",
        productId: 1
        productName: "Banana",
        productId: 2
        productName: "Peach",
        productId: 3

My question is, when users select the product, how to store productId from the selected product to a newly created variable in ts? There are multiple p-dropdown in p-table‘s rows so I want to store the multiple productId selected values into an array selectedProductId.

// product.component.ts
// How to store productID from the selected product to a newly created variable in ts?
selectedProductId!: any[];


I suggest you to read the documentation at

In your case it seems be possible do that:

in your.component.html:


in your.component.ts:

selectedProductId: number[] = [];

selectProduct(id: number) {
    if (!this.selectedProductId.includes(id))

Answered By – Luca Angrisani

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published