title: How to show/hide in Angular2
body: <p>I have a component that show/hide element by clicking a button.</p>
  
  <p>This is my html</p>
  
  <pre><code>  &lt;div *ngFor="let history of histories | sortdate: '-dateModified'"&gt;
      &lt;p&gt;&lt;b&gt;{{ history.remarks }}&lt;/b&gt; - &lt;i&gt;{{history.dateModified | date:'short'}}&lt;/i&gt;&lt;/p&gt;
      &lt;a href="google.com" 
      [class.datatable-icon-right]="history.$$expanded" 
      [class.datatable-icon-down]="!history.$$expanded" 
      title="Expand/Collapse Row" 
      (click)="toggleExpandRow(history)"&gt;&lt;/a&gt;
        &lt;!-- hide/show this by clicking the button above.--&gt;
      &lt;div *ngFor="let step of history.steps; let i = index"&gt;
        &lt;b&gt;{{i+1}}.&lt;/b&gt; {{step}}
        &lt;span class="clear"&gt;&lt;/span&gt;
      &lt;/div&gt;
      &lt;hr /&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>and my <code>.ts</code></p>
  
  <pre><code>  toggleExpandRow(row) {
      console.log('Toggled Expand Row!', row);
      //row
      return false;
    }
  </code></pre>
  
  <p>trying to search but, can't find any same sample.</p>
  
  <p>On jquery, I can do this, but on Angular2, I am having hard time to figure this.</p>