Разверните панель mat-extension, используя метод open в селекторе.

Question

Разверните mat-expansion-panel, используя открытый метод в selector(mat-expansion-panel)

Я использую mat-expanison-panel в своем приложении, и у меня уже есть ссылка.к нему в моем файле .ts.

@ViewChild('expansionPanel') public expansionPanel: MatExpansionModule;

<mat-expansion-panel #expansionPanel class="expansion-card" [expanded]="flashcardInputExpanded" [disabled]="!collapsable">
  <mat-expansion-panel-header>

Я пытаюсь расширить panel при вызове fn, что-то вроде этого.

  open() {
    this.expansionPanel.open();
  }

но проблема в том, что она не работает, панель не расширяется, вызывая this.expansionPanel.open();.

Ссылочная панель API - https://material.angular.io/components/expansion/api

В моем случае mat-expansion-panelнаходится внутри sidenav,

@ViewChild('sidenav') public sidenav: MatSidenav;

Итак, что происходит, так это выглядит, как только я открываю sidenav.

но когда я закрываю компонент sidenav и снова открываю его, тогда это выглядит так.

с учетом того, что у нас есть только одна опора в этом mat-expansion-panel, которая является [расширенной] = "истинной".

Answer 1

Вы можете использовать входную переменную панели расширения expanded. В вашем случае у вас уже есть определенная переменная flashcardInputExpanded.

<mat-expansion-panel [expanded]="flashcardInputExpanded">

Вы можете сделать что-то вроде этого:

open() {
  this.flashcardInputExpanded = true;
}