时间戳

首页 > 解决方案 > 有没有办法向 Angular Material Components（底页/对话框/Snackbar）添加指令？

angular - 有没有办法向 Angular Material Components（底页/对话框/Snackbar）添加指令？

问题描述

我想在左侧、右侧和底部创建一个 sidenav 应用程序，必须使用 Angular Material 组件库（https://material.angular.io/）并与 angular-resizeable-element 一起制作所有可调整大小的组件。这对于左右侧导航非常有效，因为我可以使用材质侧导航组件并将 mwlResizeable 指令简单地添加到 HTML。如下所示，这是按预期工作的。

<mat-sidenav mwlResizable 
             [enableGhostResize]="true"
             [resizeEdges]="{bottom: false, right: false, top: false, left: true}"
             (resizeEnd)="onResizeEnd($event)" 
             position="end" 
             #right>
</mat-sidenav>

对于底部导航面板，我发现 Angular Material 底板组件很合适，因为它的位置很简单。

我的问题是底部表，它被称为模态/弹出窗口，如下所示：

let dialogRef = dialog.open(DemoComponent, {
  width: '100vw'
});

这将与底部表中的 DemoComponent 完美地打开我的底部表。我想知道是否有人有一个聪明的解决方案能够将指令添加到打开的弹出窗口中，以便我可以使其（在这种情况下）可调整大小:)。

提前致谢。

标签： angularangular-materialangular-directivebottom-sheet

解决方案

这有点违背我的原则，但由于时间不够，我制作了一个始终位于底片内的默认组件，我在该组件中制作了可调整大小的手柄并将其放在顶部。然后我在自定义事件中修改工作表的高度。哈克但有效；）。如果有人也偶然发现这一点。

推荐阅读