title: ng2-bootstrap-modal closes immediately
body: <p>The dialog shows for about a second and then hides. Perhaps I could use this option "autoCloseTimeout" to set the timeout to a minute or two as a workaround, but I'm hoping there is a cleaner solution to this problem. I saw one comment that this occurred because the popup is losing focus. I ruled this out by placing a textbox on the popup and clicking on it immediately. </p>
  
  <p>Here's the html</p>
  
  <pre><code>&lt;span&gt;
    &lt;a href="#" title="Delete" class="myItem" 
       (click)="showConfirm(item.id)"&gt;
       &lt;span class='glyphicon glyphicon-trash toolbarItem'&gt;&lt;/span&gt; 
    &lt;/a&gt;
  &lt;/span&gt;
  </code></pre>
  
  <p>Here's the method in the Typescript component</p>
  
  <pre><code>showConfirm(blkId: string) {
      let disposable = this.dialogService.addDialog(ConfirmComponent, {
          title: 'Confirm title',
          message: 'Confirm message'
      })
          .subscribe((isConfirmed) =&gt; {
              //We get dialog result
              if (isConfirmed) {
                  alert('accepted');
              }
              else {
                  alert('declined');
              }
          });
      //We can close dialog calling disposable.unsubscribe();
      //If dialog was not closed manually close it by timeout
      setTimeout(() =&gt; {
          disposable.unsubscribe();
      }, 4000);  //changign this value has no affect
  }
  </code></pre>
  
  <p>Here's the ConfirmDialog component source:</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { DialogComponent, DialogService } from "ng2-bootstrap-modal";
  export interface ConfirmModel {
      title: string;
      message: string;
  }
  @Component({
      selector: 'confirm',
      template: `&lt;div class="modal-dialog"&gt;
                  &lt;div class="modal-content"&gt;
                     &lt;div class="modal-header"&gt;
                       &lt;button type="button" class="close" (click)="close()" &gt;&amp;times;&lt;/button&gt;
                       &lt;h4 class="modal-title"&gt;{{title || 'Confirm'}}&lt;/h4&gt;
                     &lt;/div&gt;
                     &lt;div class="modal-body"&gt;
                       &lt;p&gt;{{message || 'Are you sure?'}}&lt;/p&gt;
                     &lt;/div&gt;
                     &lt;div class="modal-footer"&gt;
                       &lt;button type="button" class="btn btn-primary" (click)="confirm()"&gt;OK&lt;/button&gt;
                       &lt;button type="button" class="btn btn-default" (click)="close()" &gt;Cancel&lt;/button&gt;
                     &lt;/div&gt;
                   &lt;/div&gt;
                &lt;/div&gt;`
  })
  export class ConfirmComponent extends DialogComponent&lt;ConfirmModel, boolean&gt; implements ConfirmModel {
      title: string;
      message: string;
      constructor(dialogService: DialogService) {
          super(dialogService);
      }
      confirm() {
          // we set dialog result as true on click on confirm button, 
          // then we can get dialog result from caller code 
          this.result = true;
          this.close();
      }
  }
  </code></pre>
  
  <p>I'm using the following versions: 
      angular 2.4.5,
      angular2-platform-node, ~2.0.11
      bootstrap: ^3.3.7</p>