title: How to open and hide ng-bootstrap datepicker on custom actions?
body: <p>Currently I am using: </p>
  
  <ul>
  <li>ng-bootstrap 1.0.0-alpha.24</li>
  <li>angular/core 4.0.0</li>
  <li>bootstrap 4.0.0-alpha.6</li>
  </ul>
  
  <p>I wanted to ask if someone knows how to autoclose the datepicker
  when the focus is lost or another datepicker is opened.</p>
  
  <p>Also i wanted to now if it is possible to close the datepicker in the component code with typescript.</p>
  
  <p>It would be nice if someone could provide a working plunker or a code snippet.</p>
  
  <p>My actual implementation:</p>
  
  <pre><code>&lt;div class="input-group"&gt;
      &lt;input class="rect-border full-width"
             placeholder="YYMMDD"
             [(ngModel)]="selectedDate"
             ngbDatepicker
             #datePickerInput="ngbDatepicker"
             (keydown.arrowup)="incrementDate()"
             (keydown.arrowdown)="decrementDate()"
             (ngModelChange)="validate('modelChanged')"
             (blur)="validate(null)"
             [disabled]="disabled"
             [ngClass]="{'input-required': required, 'normal-color': valid, 'picker-disabled': disabled}"&gt;
  
      &lt;div class="input-group-addon rect-border"
           (click)="disabled ? true : datePickerInput.toggle()"
           [ngClass]="{'picker-button-disabled': disabled}"&gt;
          &lt;img src="assets/img/calendar-icon.svg" class="datpickerToggle"/&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Plunker: <a href="https://ng-bootstrap.github.io/app/components/datepicker/demos/popup/plnkr.html" rel="noreferrer">ng-bootstrap team demo</a></p>
  
  <p>I have searched a long time and I am also pretty new to angular and these things.</p>
  
  <p>Thank you for your help!</p>
  
  <p>Update:</p>
  
  <p>Possible solution:</p>
  
  <p>There were a lot of good solutions provided.
  I also found out by myself that I could use the class NgbInputDatepicker
  to close the datePicker (I always used NgbDatepicker, so it didn't work).</p>
  
  <pre><code>@ViewChild('datePickerInput') datePicker: NgbInputDatepicker;
  
  this.datePicker.close();
  </code></pre>