This is a simple drop down, but in IE11 you cannot see the chosen menu item. Do you know any workarounds?
<div class="form-group program-container">
<select class="form-control container-fluid" (change)="onChooseMenuItem($event)" [(ngModel)]="ngrxActiveMenuItem">
<option class="selected-class" selected disabled>{{ngrxActiveMenuItem}}</option>
<option *ngFor="let menuItem of ngrxMenuItems, let i = index"
value={{i}}>
{{menuItem.programName}}
</option>
</select>
</div>
this is the top component:
<div class="container home-container">
<div class="row mb-3">
<div class="col-sm-6 mb-2">
<div class="card border-left-primary shadow-sm py-2 h-100">
<div class="card-body pt-2 pb-2">
<div class="row no-gutters align-items-center">
<div class="col-sm-6 text-xs font-weight-bold text-primary text-uppercase mb-1">
Programs:
</div>
<div class="col-sm-6 mt-3">
<app-program-dropdown></app-program-dropdown>
</div>
</div>
</div>
</div>
</div>
try adding [selected] instead of what you have:
<select>
<option *ngFor="let menuItem of ngrxMenuItems, let i = index"
value={{I}} [selected]="menuItem.programName == ngrxActiveMenuItem">
{{menuItem.programName}}
</option>
</select>
There would be a file browserslist in your project folder. You may try adding IE11 in it.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.