I'm encountering the following issue.
https://i.sstatic.net/fV1D1.png
When I click on the area indicated by the BLUE ARROW in the image above, it leads to the of of ngFor loop in my html template.
<div class="w-[60%]">
<select
name="duration"
id=""
class="text-[1rem] leading-6 py-2 px-8 border border-[#BCBCBC] w-[27.875rem] rounded-md focus:outline-none focus:border-primary"
[formControl]="demoLength"
required
>
<option
[value]="timing.value"
*ngFor="let timing of staticDurationArray"
selected="{{ timing.selected }}"
>
{{ timing.time }}
</option>
</select>
</div>
Furthermore, the staticDurationArray in the code above is an array containing static data in the TS file
staticDurationArray = [
{
time: '15 min',
value: 15,
selected: '',
},
{
time: '30 min',
value: 30,
selected: '',
},
{
time: '45 min',
value: 45,
selected: '',
},
{
time: '1 hr',
value: 60,
selected: '',
},
]