Отзывчивый sidenav в Angular Material, ничего не появляется - PullRequest
Новая
       11

Отзывчивый sidenav в Angular Material, ничего не появляется

0 голосов
/ 04 июня 2019

, чтобы попробовать следующий пример об отзывчивом угловом материале sidenav

https://medium.com/@lopesgon/angular-material-a-responsive-sidenav-ef1d06b37986

Я создал компонент с точно включенным кодом, но ничего не появляется.Как я могу решить проблему?

Я уже искал некоторые решения и исправил проблему с версией (в html-файле не более "md", но "mat". Была решена только ошибка в консоли браузера, но ничего не появилось.

Просмотр: 

<md-sidenav-container>
  <md-sidenav #sidenav [opened]="screenWidth > 840" [mode]="(screenWidth > 840) ? 'side' : 'over'">
    <div class="sidenav-header">
      <a routerLink="/"><h5>Hello world!</h5></a>
    </div>
  </md-sidenav>

  <div [ngStyle]="{'display' : (screenWidth > 840) ? 'none' : 'block'}">
    <button type="button" md-button (click)="sidenav.open()">
      Toggle sidenav when display is block
    </button>
  </div>

  <router-outlet></router-outlet>

</md-sidenav-container>

Компонент: 

screenWidth: number;

constructor() {
  // set screenWidth on page load
  this.screenWidth = window.innerWidth;
  window.onresize = () => {
    // set screenWidth on screen size change
    this.screenWidth = window.innerWidth;
  };
}
...