title: angular JS table row show/hide
body: <pre><code>&lt;table &gt;    
  
     &lt;thead&gt;
      &lt;tr &gt;
        &lt;th&gt;Honda&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
  
    &lt;tbody&gt;
      &lt;tr&gt;
        &lt;td&gt;CRV&lt;/td&gt;
        &lt;td&gt;HRV&lt;/td&gt;
        &lt;td&gt;Accord&lt;/td&gt;
     &lt;/tr&gt;
     &lt;/tbody&gt; 
  
     &lt;tr&gt;
        &lt;th&gt;Toyota&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody &gt;
      &lt;tr&gt;
        &lt;td&gt;Camry&lt;/td&gt;
        &lt;td&gt;Corolla&lt;/td&gt;
    &lt;/tr&gt;
     &lt;/tbody&gt; 
  
  &lt;/table&gt;
  </code></pre>
  
  <p>I have a requirement to show / hide table row. This form should hide the car model initially and show only Honda and Toyota. when you click Honda, it should show all the honda's model. How to achieve this in angualr js. Please help me.</p>