Primeng dropdown does not sidplay the values


I am facing a strange issue. I want to populate a dropdown from an http request. The array declared as an Agence object is filled with the correct attributes from my backend but it cannot display the values.

<p-dropdown [options]="agences" [(ngModel)]="codeAgence" optionLabel="code" [ngModelOptions]=" 
{standalone: true}"></p-dropdown>

I push a first line manually on the array, the dropdown display only this one added but ignore the other attributes came from the http request. The strang thing is that the array really has the proper attributes after the http request as seen on this screenshot

agences array

the code of my component is here :

interface Agence {
    name: string,
    code: string

export class Agences {
  id: string;
  label: string;
  order: string;
  code: string;

  fonctions: Fonction[];

  constructor(values: Object = {}) {
       Object.assign(this, values);

  selector: 'app-gestion-courrier',
  templateUrl: './gestion-courrier.component.html',
  styleUrls: ['./gestion-courrier.component.css']
export class GestionCourrierComponent implements OnInit {

  agences:Agence[] = [];
  listeAgences: Agences[] = [];

ngOnInit() {

getAllAgences() {
  this.http.get(endPointAgences).subscribe((result: Agences[]) => {
  this.listeAgences = result;
  for (let i in this.listeAgences) {
    this.agences.push(this.listeAgences[i].label, this.listeAgences[i].code);

Source: Angular Questions


Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Still Have Questions?

Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us