在日历中使用点击和鼠标悬停事件

Question

1。如何在特定日期将鼠标悬停在某一天中从一组天数中更改角度形式控制输入值，如果在特定日期单击鼠标，将设置输入值以禁用鼠标悬停。

模板

 <div class="flex-container flex-wrap col-md-16">
                <div *ngFor='let day of daysArr' >
                  <div class="calender-days flex-center flex-container" 
                         (click)='selectDate(day,$event)' 
                           (mouseover)='dateHovered(day,$event)' [ngClass]="{'inactive':!day,'today':todayCheck(day),'selected':isSelected(day)}">{{day?.date()}}
                  </div>
                </div>


**Component and Event handler**

Export class DPR {

//Constructor and other code//
.
.
.
//below is selectDate onclick event
public selectDate(day,$event:MouseEvent) {
    let dayFormatted = day.format('YYYY-MM-DD');

      if (this.dateForm.valid) {
      this.dateForm.setValue({ dateFrom:this.date.format('YYYY-MM-DD'), dateTo:this.date.add(1,'d').format('YYYY-MM-DD') });
      return;
    }
    if (this.dateForm.get('dateFrom').value !== this.date && this.dateForm.get('dateTo').value == this.date.add(1,'d') ) {
        this.dateForm.get('dateFrom').patchValue(dayFormatted);
        this.toSelected=true
        console.log('this is:',this.dateForm.get('dateFrom').value)

    }

}

public dateHovered(day,$event:MouseEvent) {
    let dayFormatted = day.format('YYYY-MM-DD');
      if(!this.fromSelected){
        this.dateForm.get('dateFrom').setValue(dayFormatted);
        console.log('event is:',$event.target)

    }
    if(!this.toSelected)              
     this.dateForm.get('dateTo').setValue(dayFormatted);

  }