Angular: mat-sidenav игнорирует автоматический размер или режим изменения размера - PullRequest
0 голосов
/ 07 октября 2019

Я сейчас пытаюсь внедрить mat-sidenav в проект. Кажется, что все работает нормально, за исключением одной ситуации: если я запускаю приложение локально в браузере, вынимаю вкладку окна, содержащую приложение, и отпускаю его (в основном вынуждая его изменять размеры несколько раз), это вызывает егооткройте в новом и отдельном окне браузера. Текущая страница тоже выглядит хорошо, sidenav находится в стороне, как и ожидалось.

Однако, когда я перехожу на другую страницу, содержимое этой страницы попадает под боковую навигацию. Я также попытался установить autosize = true, и это помогло в том смысле, что если я выхожу из страницы и возвращаюсь, он восстанавливает то, как должен выглядеть, т.е. sidenav слева и отображение содержимого страницы справа,

Я также пытался установить тайм-аут, а затем принудительно открывать и закрывать боковую навигацию, но это, похоже, не помогает. Может быть, есть способ принудительно обновить другие страницы? Код боковой навигации - это отдельный компонент, если он помогает пролить свет на ситуацию. Вставить, как выглядит код:

<mat-sidenav-container [class]="mobRes?'project1-sidenav mob-sidenav':'project1-sidenav desk-sidenav'" autosize="true">
        <mat-sidenav #sidenav [mode]="!mobRes?'side':'over'" fixedInViewport="false" [opened]="!mobRes" [disableClose]="!mobRes"> 

...

</mat-sidenav>
</mat-sidenav-container>

РЕДАКТИРОВАТЬ: я запустил несколько console.logs для события resize и по какой-то причине, после нескольких попыток, он запускает 3-6 события изменения размера вместо 2,и это как раз тогда, когда navbar начинает перекрываться с контентом. До этого все работает как положено (навигационная панель слева и контент справа). Еще одна интересная вещь: в отладчике chrome, когда он работает, console.logs сгруппированы (появляется только один экземпляр с номером рядом с ним), но когда он начинает давать сбой, как в случае, упомянутом выше, всеconsole.logs появляются в разных строках, хотя сообщение точно такое же. Обратите внимание, что на данный момент в консоль больше ничего не пишется. Извините, если редактирование не помогло, но я подумал, что предоставлю столько подсказок, сколько смогу, чтобы изучить это. Если я это выясню, я также опубликую ответ, если кто-то еще столкнется с этим.

Правка № 2: Это поведение начинается, когда я ухожу с текущей страницы. Итак, чтобы воспроизвести его, запустите приложение, вытащите вкладку и несколько раз измените размер, затем отойдите от страницы (я делаю это, нажав на ссылку на боковой навигационной панели), вернитесь и повторите изменение размера. опять же, на этот раз, когда вы перейдете на другую страницу, она будет закрыта, перейдете на другую страницу и вернетесь, она вернется к предполагаемым позициям

1 Ответ

0 голосов
/ 08 октября 2019

В качестве обходного пути я добавил toggle () для события resize в файле компонентов .ts. Это немного неприятно, но это лучше, чем скрытый контент.

...