Retrieving current value of angular select div

I need to get the current chosen value of select label, becuase the next label data depends on this selected above day. My html for the label looks like this:

<div class="form-group">
          <label for ="visitData">Choose day for the visit : </label>
          <select  class="form-control" id="visitData" (change) = "updateVisitDate($event)" >
            <option   id="visitData" *ngFor="let type of myDate" value="{{type.date}}">{{type.date}}</option>
            </select>
        </div>

The function in TypeScript file:

  updateVisitDate(event:any){
    event.preventDefault()
    let target = event.target;
    this.visitData = target.querySelector('#visitData').value;
    console.log("Found date : "+ this.visitData);
    this.http.get(`http://localhost:9000/freeHours/getDay`,{params : {date:this.visitData}}).subscribe(data=>this.periods = data);
  } 

Whenever i change the day from the select field i get in the log the same day(first option). Any suggestions?