DatePicker picking same values for all in Angular

I am working on an application in which i am using 3rd party datePicker. So in this application i have used two datepicker from date and to date. The problem is when I set date value in from date, the same value gets set in to date also which is incorrect.

Below are the sample code for understanding

app.component.html

      <input [owlDateTime]="dt1" [(ngModel)]="dateTime" readonly #fromDate>
      <span [owlDateTimeTrigger]="dt1" class="calendar"><i class="fa fa-calendar"></i></span>
      <owl-date-time #dt1></owl-date-time>

      <input #toDate [owlDateTime]="dt2" [(ngModel)]="dateTime" [owlDateTimeTrigger]="dt2" readonly
        (ngModelChange)="onChange($event,fromDate.value,toDate.value)">
      <span [owlDateTimeTrigger]="dt2" class="calendar"><i class="fa fa-calendar"></i></span>
      <owl-date-time #dt2></owl-date-time>

app.component.ts

  public dateTime: any;
  dt: any;
  dt1: any;
  dt2: any;


  onChange(data: any, fromDatePicker: any, toDatePicker: any) {
    console.log(fromDatePicker, toDatePicker);
    if (fromDatePicker !== '' && toDatePicker !== '') {
console.log(fromDatePicker,toDatePicker);
      }

    else {
      console.log('Either one of the date is empty');
    }
  }

any solution please ?