Пользовательский заголовок в angular материал аккордеон

Question

Как мне настроить <mat-panel-title> для поддержки субтитров под заголовком? Я пытаюсь добавить некоторые теги HTML, но не работает. На данный момент у меня есть это:

мой стек

Answer 1

Вы можете использовать дисплей flex-box:

<mat-panel-title style="display: flex; flex-direction: column">
  <span>HEADER</span>
  <span>subtitle</span>
</mat-panel-title>

Но сделайте это, используя селектор класса css.

В css файле:

.column-layout {
  display: flex; 
  flex-direction: column;
}

В вашем шаблоне:

<mat-panel-title class="column-layout">
  <span>HEADER</span>
  <span>subtitle</span>
</mat-panel-title>