title: how to pass respective item details to a modal ng2-bootstrap?
body: <p>I'm using <a href="http://valor-software.com/ng2-bootstrap/#/modals" rel="nofollow noreferrer">ng2-bootstrap modal</a></p>
  
  <p>to display more details of an item. When I click on the respective item  I want to display it's respective details to the modal.</p>
  
  <p><strong>Here is my code</strong></p>
  
  <pre><code>&lt;table  class="table table-hover table-bordered table-striped tableheader"&gt;
  &lt;thead&gt;
    &lt;tr&gt;
      &lt;th&gt;First Name&lt;/th&gt;
      &lt;th&gt;Last Name&lt;/th&gt;
      &lt;th&gt;Gender&lt;/th&gt;
      &lt;th&gt;City&lt;/th&gt;
      &lt;th&gt;Country&lt;/th&gt;
      &lt;th&gt;Age&lt;/th&gt;
    &lt;/tr&gt;
  &lt;/thead&gt;
    &lt;tbody *ngFor="let item of results$ | async" &gt;
       &lt;tr   (click)="lgModal.show(item)"&gt;
        &lt;td&gt;
         {{item.firstName}}
        &lt;/td&gt; 
        &lt;td&gt;{{item.lastName}}&lt;/td&gt;
        &lt;td&gt;{{item.gender}}&lt;/td&gt;
        &lt;td&gt;{{item.city}}&lt;/td&gt;
        &lt;td&gt;{{item.country}}&lt;/td&gt;
        &lt;td&gt;{{item.age}}&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>When I click on the respective row I want to pass only respective user other details but it's passing complete json of my results$ to the modal Which is in the same <strong>Component</strong></p>
  
  <pre><code>  &lt;div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true"&gt;
    &lt;div class="modal-dialog modal-lg"&gt;
      &lt;div class="modal-content"&gt;
        &lt;div class="modal-header"&gt;
          &lt;button type="button" class="close" (click)="lgModal.hide()" aria-label="Close"&gt;
            &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
          &lt;/button&gt;
          &lt;h4 class="modal-title"&gt;Complete Details&lt;/h4&gt;
        &lt;/div&gt;
        &lt;div class="modal-body"&gt;
          &lt;div  &gt;
             {{ item | json }} // not getting item details here
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How to do this??</p>