Hello,
I'm customizing schedule editor #editorTemplate with angular material components such as mat-select.
The problem is angular material's overlay is shown behind scheduler's one, so the mat-select options are not visible.
I've noticed that :
1.Scheduler just initialized and editor is not yet opened
<body>
<app-root>...</app-root>
...
<div class="e-dlg-container e-schedule-dialog e-dlg-center-center e-schedule-dialog-container" style="z-index: 1001;">
<div class="e-dlg-container e-quick-dialog e-dlg-center-center" style="z-index: 1002;">
...
</body>
2.Editor is opened and angular material components inits just after
<body>
<app-root>...</app-root>
...
<div class="e-dlg-container e-schedule-dialog e-dlg-center-center e-schedule-dialog-container" style="z-index: 1001;">...</div>
<div class="e-dlg-container e-quick-dialog e-dlg-center-center" style="z-index: 1002;">...</div>
<div class="cdk-overlay-container">...</div>
...
</body>
At this instant, the cdk-overlay-container is not visible no I've added ::ng-deep.cdk-overlay-container { z-index: 1004; } and its working.
3.The editor is closed and then re-opened, the editor's overlay's z-index seems calculated from existing components and is increased, so cdk-overlay-container is not visible anymore.
<body>
<app-root>...</app-root>
...
<div class="e-dlg-container e-schedule-dialog e-dlg-center-center e-schedule-dialog-container" style="z-index: 1005; display: flex; position: fixed;">...</div>
<div class="e-dlg-container e-quick-dialog e-dlg-center-center" style="z-index: 1002;">...</div>
<div class="cdk-overlay-container">...</div>
...
</body>
I think this is normal behaviour of scheduler's overlays but do you have any solution/best practice to keep angular material's overlay visible? I can't manage to set scheduler's z-index constant
Thank you for your help!
