Angular 4 Get the Text of Selected option of Select control

Question

I am trying to get the Text of Selected option of Select control in Angular 4.

HTML:

<div class="col-sm-6 form-group">
<label>Industry</label>
<select   class="form-control select"  formControlName="Industry">
<option value="">Please select Value</option>  
<option *ngFor="let industry of industries"  
[ngValue]="industry.ID">{{industry.Name}}  
</option>  
</select> 
</div>


upload.component.ts
this.form.controls['Industry'].valueChanges.subscribe((name) => {
                this.form.controls['IndustryName'].setValue(name);
  });

I am using formControlName property from Reactive.

Kindly suggest the idea to retrive the Text of Selected Select control

Answer 1

You can use

<select class="form-control" (change)="onChange($event)">

</select>

then in the component

onChange($event){
let text = $event.target.options[$event.target.options.selectedIndex].text;
}