Угловой материал: откройте mat-sidenav из mat-dialog или @component

Question

Я долго искал решение для этого, поэтому любая помощь была бы отличной.

Я использую Angular Material 2, и я хочу использовать .open() метод для mat-sidenav нажав кнопку в mat-dialog или только когда диалог закрывается.

В соответствии с документацией, я могу пометить mat-sidenav элемент с #sidenav (или что-то), а затем положить (click)="sidenav.open()" в элементе кнопки. Однако, это не работает (я читал, что это может иметь отношение к различным z-плоскостям?).

Это выглядит примерно так:

sidenav.html

<mat-sidenav-container>
  <mat-sidenav #sidenav opened="false"> ... </mat-sidenav>
</mat-sidenav-container>

<button mat-button (click)="openDialog"></button>

dialog.html

<button mat-button (click)="sidenav.open()">Open Sidenav</button>

Диалог открывается и закрывается нормально и sidenav (через другую кнопку).

Я уверен, что есть способ открыть sidenav из @component, но я не понял, как после того, как попробовал несколько методов.

Спасибо

Изменить: я должен был сказать, что я довольно плохо знаком с Angular 2+, так что если бы вы могли включить фрагмент кода с ответом, я был бы признателен.

Answer 1

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

Как упомянуто @PankajParkar, вы можете передать sidenav переменная в диалоге, когда вы открываете диалог.

let dialogRef = this.dialog.open(MyDialogComponent, {
    data: {
        sidenav: this.sidenav
    }
})

Затем из диалога вы можете позвонить this.data.sidenav.open(), Так как я не пробовал это, я не уверен, где sidenav закончится. Он может отображаться под диалоговым окном, но если диалоговое окно закрывается немедленно, я думаю, это не будет проблемой.