Question

我在带有扩展面板的mat-expansion-panel中使用mat-菜单，我将mat-icon放在扩展面板标题的末尾，单击此图标将打开一个菜单项。在扩展面板标题上单击时，将打开面板描述。这是所需的行为，通过单击鼠标即可起作用。

但是当我通过keydown.enter（使用制表符）导航到图标时，这是不一样的，当我将其制表符放到图标中并按Enter时，它正在折叠面板，以某种方式我用event.stopPropagation（）修复并返回false 。但是按图标上的Enter键并没有打开菜单项。这是stackblitz链接menuwithExpansionPanel。请帮助我解决这个问题。预先感谢。

Answer 1

您的按钮应该是触发器，而不是图标：

<span class="export-to-csv-span">
  <button mat-button variant="icon-button"
      [matMenuTriggerFor]="exportAsMenu"
      (click)="$event.stopPropagation()"
      (keydown.enter)="$event.stopPropagation()"
      (keydown.space)="$event.stopPropagation()">
    <mat-icon>vertical_align_bottom</mat-icon>
  </button>
</span>

菜单在keydown上没有打开。在角撑板6的扩展垫面板头内使用时输入

1 个答案: