title: Expand and collapse icons for mat table with accordion - Angular
body: <p>I'm using a generic component for displaying table with accordion. 
  I somehow achieved the functionality which is working fine.
  But I'm facing issue with expand and collapse icons.
  when I click on a particular row I want only that row icon to be changed.
  But all the icons in all rows are changed.</p>
  
  <pre><code>    &lt;mat-icon *ngIf="col.columnDef == ' ' &amp;&amp; !expanded"&gt;
        {{ expandedElement ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}
      &lt;/mat-icon&gt;
  </code></pre>
  
  <p>Stackblitz :<a href="https://stackblitz.com/edit/angular-yr45pl" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-yr45pl</a></p>
  
  <p>Thanks in Advance.</p>