I am facing a challenge with my Angular 5 dropdown. It currently works well with hard coded data, but I now need to switch it to live data. The issue is that the live data I have is in plain array format.
Here is how it currently functions
HTML
<select...
<option *ngFor="let activityType of activityTypes" [ngValue]="activityType.Id">
{{activityType.Activity}}
</option>
Typescript Component
activityTypes: any[];
this.activityTypes = [
{ Id: 1, Activity: "Select One" },
{ Id: 2, Activity: "Insert" },
{ Id: 2, Activity: "Update" },
{ Id: 3, Activity: "Delete" },
];
However, the challenge arises when I retrieve data from a service and the format is as follows:
this.activityTypes v["INSERT", "UPDATE"]
0: "INSERT"
1: "UPDATE"
click to see dev tool image output
Now, how can I bind this array to the dropdown? Ideally, I would like to set values as "0" and "1" for the array, and then display "INSERT" and "UPDATE" respectively...