Angular ngx-bootstrap错误地写入2个不同的输入框

Question

我正在使用此ngx-bootstrap datepicker for angular 5 - 除非任何人都可以建议“更好”的。

https://valor-software.com/ngx-bootstrap/#/datepicker

  

我遇到2个输入文本框时遇到问题，点击复选框的事件正在影响两个输入！

HTML模板

输入框＃1

<input type="text" 
       class="form-control" 
       [(ngModel)]="HearingDate" name="HearingDate" id="HearingDate"
       [minDate]="minDate" 
       [maxDate]="maxDate" 
       #dp="bsDatepicker" 
       bsDatepicker [(bsValue)]="bsValue"
       [bsConfig]="dpConfig">

输入框＃2

<input type="text" 
     class="form-control" 
     [(ngModel)]="ReporterDate" name="ReporterDate" id="ReporterDate"
     [minDate]="minDate" 
     [maxDate]="maxDate" 
     #xdp="bsDatepicker" 
     bsDatepicker [(bsValue)]="bsValue"
     [bsConfig]="dpConfig">

ngModel绑定

ReporterDate: any;
HearingDate: any;

复选框事件功能

onReporterChange(){
   //this.reporter = !this.reporter;

    var currentDt = new Date();
    var mm = currentDt.getMonth() + 1;
    var dd = currentDt.getDate();
    var yyyy = currentDt.getFullYear();
    var date = mm + '/' + dd + '/' + yyyy;
    //BELOW IS SETTING NOT ONLY ReporterDate, but HearingDate too!
    this.ReporterDate = date;

}

问题是这个

  

功能不仅仅是设置ReporterDate，而是设置HearingDate！

也许全部都在#dp或者我不太了解的东西（模板参考变量）？