md-sidenav отзывчивый, с Flex-Layout

Question

Я делаю приложение с Angular и Flex-Layout, я использую точки останова, чтобы скрыть панель навигации. Мне нужно использовать событие click, чтобы показать панель навигации, когда она скрыта. Мой код сопровождается:

<md-sidenav-container>
<md-toolbar>
    <button class="button" md-icon-button fxHide.gt-sm="true" (click)="sidenav.toggle()">
      <md-icon>menu</md-icon>
    </button>
    <span class="title">Assistant</span>
  </md-toolbar>
  <md-sidenav #sidenav mode="side" opened="true" fxHide fxShow.gt-sm>Drawer content</md-sidenav>
  <div class="my-content">Main content</div>
</md-sidenav-container>

Точки останова работают правильно, но щелчок события для переключения панели навигации не работает. Какое решение?

Answer 1

Обновите <md-sidenav> с

<md-sidenav ... [fxHide]="hideSidebar" ...>Drawer content</md-sidenav>

и на вашем компоненте создать глобальный hideSidebar переменная, которая отслеживает состояние sidenav, поэтому, нажав кнопку, вы установите эту переменную в true/false и покажет / скроет сиденав соответственно.

<button class="button" ... (click)="toggleSidebar()">

toggleSidebar(): void { this.hideSidebar = !this.hideSidebar }

Надеюсь, что это поможет, и дайте мне знать, если я неправильно понял ваш вопрос