title: How to close calendar popup after clicking on date
body: <p>How can I hide the calendar after a date is selected? I am using <a href="https://github.com/DanielYKPan/date-time-picker" rel="nofollow noreferrer">Date-time-picker by DanyelYKPan</a>.</p>
  
  <p>Is there a specific function that I can use? My code below</p>
  
  <pre><code> &lt;div class="col-3"&gt;
    &lt;div class="form-group calenderForm calenderForm1"&gt;
     &lt;label for="templateName"&gt;REPAIR DATE (FROM)&lt;/label&gt;
      &lt;owl-date-time name="repairDateFrom"
       [(ngModel)]="repairDateFrom" 
       [max]="max"
       [type]="'calendar'"
       [dateFormat]="'YYYY-MM-DD'"
       [placeHolder]="'YYYY-MM-DD'"
      &gt;&lt;/owl-date-time&gt;
    &lt;div class="error-message-block"&gt;&lt;/div&gt;
    &lt;input type="hidden" name="repairDateFrom" id = "repairDateFrom" value="
    {{repairDateFrom | date: 'yyyy-MM-dd'}}" (click)="closeDatePopUp()"/&gt;
    &lt;/div&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>From top of the code  through picker plugin component call will goes to below function.</p>
  
  <pre><code>    DateTimePickerComponent.prototype.updateFormattedValue = function () {
      var formattedValue = '';
      if (this.value) {
          var d = new Date();
  
          if (this.isSingleSelection()) {
              this.value = this.value.setHours(d.getHours(), d.getMinutes());
              formattedValue = date_fns_1.format(this.value, this.dateFormat, 
              { locale: this.locale.dateFns });
              $('.owl-calendar-wrapper').on('click',function(){
                  $('.owl-dateTime-dialog').hide();
              });
          }}}
  </code></pre>
  
  <p>I tried with above code it will works only one time after clicking on date field second time date popup will not come.
  Please help me to solve this problem.</p>