title: Best practice for calling the NgbModal open method
body: <p>Toying around with the <a href="https://ng-bootstrap.github.io/#/components/modal" rel="noreferrer">NgbModal</a> and want to trigger the open method -> <code>open(content: string | TemplateRef&lt;any&gt;, options: NgbModalOptions)</code> &lt;- from somewhere else than the template code. In my case case I want to pass a string as a parameter when running the method in the .ts file of my component. When running the method via a button in the html file like so: <code>&lt;button (click)="open(content)"&gt;Launch demo modal&lt;/button&gt;</code>, the code works great, of course with all the code from within the <code>&lt;template&gt;&lt;/template&gt;</code> in the html file.</p>
  
  <p>Trying to accomplish something with this:</p>
  
  <pre><code>logoutScreenOptions: NgbModalOptions = {
      backdrop: 'static',
      keyboard: false
  };
  
  lockedWindow: NgbModalRef;
  
  lockedScreenContent= `
      &lt;template #content let-c="close" let-d="dismiss"&gt;
          &lt;div class="modal-header" style="text-align: center"&gt;
              &lt;h3 class="modal-title"&gt;Title&lt;/h3&gt;
          &lt;/div&gt;
          &lt;div class="modal-body"&gt;
              &lt;p&gt;Body&lt;/p&gt;
          &lt;/div&gt;
          &lt;div class="modal-footer"&gt;
              &lt;p&gt;Footer&lt;/p&gt;
          &lt;/div&gt;
      &lt;/template&gt;
  `;
  
  openLockedScreen(){
      this.open(this.lockedScreenContent);
  }
  
  open(content) {
      console.log(content);
      this.lockedWindow = this.modalService.open(content, this.logoutScreenOptions);
      this.lockedWindow.result.then((result) =&gt; {
          this.closeResult = `Closed with: ${result}`;
      }, (reason) =&gt; {
          this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
      });
  }
  </code></pre>
  
  <p>Code runs with no errors, and the modal opens like so:
  <a href="http://i.stack.imgur.com/u7a3V.png" rel="noreferrer">Modal without rendered content</a>
  ...which is not exactly what I want!</p>
  
  <p>Also tried like this, with exactly the same result:</p>
  
  <pre><code>lockedScreenContent= `
      &lt;div class="modal-header" style="text-align: center"&gt;
          &lt;h3 class="modal-title"&gt;Title&lt;/h3&gt;
      &lt;/div&gt;
      &lt;div class="modal-body"&gt;
          &lt;p&gt;Body&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="modal-footer"&gt;
          &lt;p&gt;Footer&lt;/p&gt;
      &lt;/div&gt;
  `;
  </code></pre>
  
  <p>What am I missing? Wouldn't it be possible to just pass a string as the "content" parameter?</p>
  
  <p>Can't see to get my head around how to use a templateRef parameter from the ts file either!</p>