Мой указатель даты дизайна материала в Angular выполняет рендеринг ниже содержимого.
У меня есть один компонент, который является частью модуля и отображается внутри приложения- root. Внутри этого у меня есть mat-stepper, а внутри одного шага у меня есть mat-datepicker.
Это как компонент apporx. выглядит так:
<mat-horizontal-stepper #stepper>
<mat-step>
<div data-component="app-root">
<section>
...
<mat-form-ifield>
<mat-label>Choose a date</mat-label>
<input matInput [matDatepicker]="picker">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-ifield>
...
И, когда я осматриваю страницу, я вижу следующее:
<head>
<body>
<app-root>
<my component here>
<couple of scripts>
<div class="cdk-overlay-container>...</div> (this is where the datepicker is rendered)
Я думаю, что я могу это исправить, отредактировав css для cdk-overlay -контейнер класса, но это не похоже на правильный путь. В чем здесь проблема?
