Angular材料mat-menu溢出屏幕-Java 学习之路

我在一个角度应用程序中有一个菜单溢出页面（从屏幕右侧消失） .

我已经尝试了一些测试应用程序，它似乎总是起作用（材料在边界框中工作并将菜单向左推，直到它适合） .

有没有人有任何想法可以运行哪种css或js将菜单推到屏幕上 . 或者，如果有一个父元素，我可以包装菜单按钮来帮助它？（在bootstrap 3中存在类似的问题，需要父内联元素进行下拉才能执行此操作） .

有问题的应用程序非常复杂，并且有侧导航等，菜单实际上有很多组件 . 但我已经尝试过移植菜单的html，直到它位于app-root（或其第一个加载的组件）之下，但它仍然是错误的 .

我会发生什么事情，但测试应用总是有效:( :(

这是代码的一个例子 - 但显然这不是问题：

<div class="text-right">

    <button mat-raised-button [matMenuTriggerFor]="menuTest">
      Actions&nbsp;&#9660;
    </button>

    <mat-menu #menuTest="matMenu">
      <button mat-menu-item>Test 1</button>
      <button mat-menu-item>Test 2</button>
      <button mat-menu-item>Test 3</button>
      <button mat-menu-item disabled="disabled">
        Test 4
      </button>
      <button mat-menu-item>
        Test 5
      </button>
    </mat-menu>

  </div>

编辑：如果有帮助 - （工作）示例总是在cdk-overlay上获得“正确”的css属性（大约8px） . 但是（破碎的）生产环境菜单得到“1806.81px”的“左” .

1 回答

-1

所以不确定为什么它不起作用 . 但是将dir = "rtl"放在 BUTTON （不是菜单）上似乎可以使它工作 .

回复于 2024-05-13T05:34:35+08:00

Angular材料mat-menu溢出屏幕

1 回答

相关问题