Comment définir la première option comme sélectionnée où les options sont construites à partir de la boîte de sélection anular 4

Question

J'ai travaillé sur un projet angulaire 4, Dans ce projet, j'ai besoin de définir la première option comme sélectionnée où toutes les options sont créées dynamiquement par boucle. code html:

<select [(ngModel)]="selectedServiceType" [ngModelOptions]="{standalone: true}" (ngModelChange)="getServiceType($event)"> 
    <ng-container *ngFor="let service of services"> 
     <option [ngValue]="service">{{service.name}}</option> 
    </ng-container> 
</select> 

Si quelqu'un sait me faire savoir au sujet. Merci d'avance!

Answer 1

Juste à vos ts, à l'intérieur ngOnInit

selectedServiceType : any; 
ngOnInit() { 
    //make sure you have values for **`services`** 
    this.selectedServiceType = services[0]; 
} 

Answer 2

Essayez comme ceci:

<select class="form-control" (change)="onChange($event)"> 
    <option *ngFor="let service of services; let itemIndex = index" [selected]="itemIndex == 0" [ngValue]="service.value">{{service.name}}</option> 
</select> 

component.ts

export class HomeComponent implements OnInit { 

    private selectedServiceType: any; 
    private services: Array<any> = []; 

    constructor() { 
     this.services = [{ 
      name: "Harish", 
      value: 5000 
     }, { 
      name: "Chandru", 
      value: 5001 
     }] 
    } 
    onChange(e) { 
     this.selectedServiceType = e.target.value; 
    } 
}