angular-material-6

This question is in reference to this Github issue, with mat-menu which can't be toggled using mouse hover, I am basically trying to replace a bootstrap based horizontal navigation menu with angular material's menu. The only thing keeping me from replicating bootstrap based menu is opening and closing mat-menu on hover. As mentioned in the above Github issue there are some workarounds to achieve what I want, like using, mouseEnter (mouseenter)="menuTrigger.openMenu()" or adding a span inside Mat-menu in order to bind mat-menu close, <mat-menu #menu="matMenu" overlapTrigger="false"> <span

I've a angular material table which uses detailRow directive to insert a detail/sibling adjacent row to a table row. StackBlitz I wanted to give it an appearance of as if the row is being expanded or collapsed, so I added couple of icons to it which are toggled on the click of cell containing them. <mat-header-cell *matHeaderCellDef> Action </mat-header-cell> <mat-cell *matCellDef="let element"> <button mat-icon-button color="primary" (click)="element[i] = !element[i]"> <mat-icon id="expand_more" #expand_more *ngIf="!element[i] " >expand_more</mat-icon> <mat-icon id="expand_less" #expand_less