Добавление заголовка в сиденав с использованием углового материала

Question

Мне нужна помощь в достижении sidenav, как на изображении выше. Я пробовал добавить несколько шагов, используя панель инструментов Mat, но не уверен, как добавить заголовок и перенести другой список под ним. Как на картинке, профиль в качестве заголовка и детали, активность, релизы под ним. Stackblitz: https://stackblitz.com/edit/angular-ve3igg

Спасибо.

Answer 1

Вы должны написать код между сайтом side-nav-container, а не mat-box-container если у вас требование боковой навигации;

   <mat-sidenav-container class="example-container">
      <mat-sidenav #sidenav mode="side" [(opened)]="opened" >
      <h1 class="bg-primary"> Header</h1>
    <hr>
    <ul class="pull-right">
      <li> first Element<li>
      <li> second Element<li>
      <li> first Element<li>

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

Вот демонстрация Stackblitz с фиктивным текстом с вашим требованием: https://stackblitz.com/angular/rmbjojbnxvk

для Вашего знания: https://material.angular.io/components/sidenav/api