title: Angular + ng-bootstrap - Modal : window does not open
body: <p>I'm new with Angular, and i have a problem while trying the simple example with ng-bootstrap modal. 
  I just tried to have a window open and instead it appears in my application.
  I'd like to have a new window open as it is explained in the ng-bootstrap example.</p>
  
  <p>I am using:
   - Angular 4.0.0
   - Bootstrap 4.0.0-alpha.6
   - @ng-bootstrap/ng-bootstrap 1.0.0-alpha.22</p>
  
  <p>I have in my file.html :</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;template #content let-c="close" let-d="dismiss"&gt;
          &lt;div class="modal-header"&gt;
              &lt;h4 class="modal-title"&gt;Modal title&lt;/h4&gt;
              &lt;button type="button" class="close" aria-label="Close" (click)="d('Cross click')"&gt;
                  &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
              &lt;/button&gt;
          &lt;/div&gt;    
          &lt;div class="modal-body"&gt;
              &lt;p&gt;One fine body&amp;hellip;&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="modal-footer"&gt;
              &lt;button type="button" class="btn btn-secondary" (click)="c('Close click')"&gt;Close&lt;/button&gt;
          &lt;/div&gt;
      &lt;/template&gt;
  
      &lt;button class="btn btn-lg btn-outline-primary" (click)="open(content)"&gt;Launch demo modal&lt;/button&gt;
  
      &lt;pre&gt;{{closeResult}}&lt;/pre&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>and in my file.ts :</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>import { Component, Input, Output, EventEmitter, ViewContainerRef } from '@angular/core';
  import { BrowserModule } from '@angular/platform-browser';
  import { NgbModal, NgbActiveModal, NgbModalOptions, NgbModalRef, ModalDismissReasons, NgbModalModule } from '@ng-bootstrap/ng-bootstrap';
  
  
  @Component( {
      selector: 'app-stagiaires',
      templateUrl: './stagiaires.component.html',
      styleUrls: ['./stagiaires.component.css'],
  } )
  
  
  export class StagiairesComponent {
  
      closeResult: string;
  
      constructor(private modalService: NgbModal) { }
  
      open(content) {
          this.modalService.open(content).result.then((result) =&gt; {
              this.closeResult = `Closed with: ${result}`;
          }, (reason) =&gt; {
              this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
          });
      }
  
      private getDismissReason(reason: any): string {
          if (reason === ModalDismissReasons.ESC) {
              return 'by pressing ESC';
          }
          else if (reason === ModalDismissReasons.BACKDROP_CLICK) {
              return 'by clicking on a backdrop';
          }
          else {
              return `with: ${reason}`;
          }
      }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>I don't have any error showing, it just open the modal in my app instead of a new window and i really don't understand why.</p>
  
  <p>Edit: 
  Here is a screen of my problem :
  <a href="https://i.stack.imgur.com/AYFs5.png" rel="nofollow noreferrer">Problem</a></p>
  
  <p>I have the button "launch demo modal" and when i click on it the "modal title" "one fine body..." appear underneath the button instead of in a modal</p>