1

Suppose to have a dropdown where the all values are loaded from an assets. this is my json file:

 "students": [{
            "id": "1",
            "name": "Allan"
        },
        {
            "id": "2",
            "name": "Spago"
        }
    ],
    "students_select": {
        "id": "2"
    },

I call my service and it print me correct values: 

this.fakeService.getDetail().subscribe((result) => {
        if (Utility.isNotNull(result)) {
          this.detail= result;

        }
      })

and in my html I do:

        <p-dropdown [options]="detail['students']" [(ngModel)]="detail['student_select']"  optionLabel="name"></p-dropdown>

the problem is that my values in dropdown are show correct but the only problem is that the value that must be show at the start is "student_select", but it show the first value "id=1 and name=allan". My api cannot be "id:2 and "name": "Spago"" because the correct way to return selected item is id. Anyone can help me to resolve this problem?

poopp
  • 1,297
  • 2
  • 13
  • 23

1 Answers1

0

Your ngModel binding should also have the student name in it. Right now you only have student id in your students_select. In your ts file, try doing this.

selectedStudent = this.students.find(student => student.id === this.students_select.id);

then, change your HTML file like so

<p-dropdown [options]="detail['students']" [(ngModel)]="selectedStudent" optionLabel="name"></p-dropdown>
ipekkr
  • 1