it is easy to get value of selected option in ts file using (change) event binding
<select name="months" (change)="onMonthsChange($event)" >
<option value="1"> January</option>
<option value="2"> February </option>
<option value="3"> March</option>
<option value="4"> April</option>
</select>
import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-test', template: ` <h2> Welcome {{name}} </h2> <select name="months" (change)="onMonthsChange($event)" > <option value="1"> January</option> <option value="2"> February</option> <option value="3"> March</option> <option value="4"> April</option> </select> `, styles: [` `] }) export class TestComponent implements OnInit { public name = "Amey Raut"; constructor() { } ngOnInit() { } onMonthsChange(event){ console.log(event.target.value); //will display value for selected Month eg. "3" console.log(event.target.options[event.target.options.selectedIndex].text); //will display Text for selected Month eg. "March" } }