title: Angular 9 using mat-table multiTemplateDataRows and want to hover/mouseover both rows at the same time
body: <p>I am new to angular and am using mat-table with multiTemplateDataRows.  So, each element from my DataSource is printed out on two rows of the table.  Both rows are always visible.  My problem is when I mouse over row 1, only row 1 is highlighted.  And, if I mouse over row 2, only row 2 is highlighted.
  But, I need both rows to highlight at the same time.  Is there a way to group the two rows for hovering/highlighting purposes?</p>
  <p>Here is how I am defining my rows:</p>
  <pre><code>&lt;tr mat-header-row *matHeader=&quot;displayedColumns; sticky:true&quot;&gt;&lt;/tr&gt;
  &lt;tr mat-row *matRowDef=&quot;let row; columns: displayedColumns;&quot; class=&quot;first-row&quot; (click)=&quot;eventPopup(row)&quot;&gt;&lt;/tr&gt;
  &lt;tr mat-row *matRowDef=&quot;let row; columns: secondRowColumns;&quot; class=&quot;second-row&quot; (click)=&quot;eventPopup(row)&quot;&gt;&lt;/tr&gt;
  </code></pre>
  <p>Thanks for any and all help!</p>