Блог

Мне нужно передать данные из angular material bottomsheet в его родительский компонент.

Например, у нас есть [mat-dialog-close] директива в angular material dialog component, где мы можем передавать данные из dialog в parent, как указано в https://material.angular.io/components/dialog/api#MatDialogClose

диалог html:

 <button [mat-dialog-close]="'dataWhichNeedsToBePassed'" cdkFocusInitial>Ok</button>
  

и получить в родительском компоненте как:

 dialogRef.afterClosed().subscribe(result => {
  console.log(result); //dataWhichNeedsToBePassed
});
  

аналогично, мне нужно передать данные из bottomsheet в родительский компонент (откуда был вызван bottomsheet).

Похоже, что в нет предопределенной директивыhttps://material.angular.io/components/bottom-sheet/api

что может быть лучшим решением здесь.

вы можете использовать его так же, как mat dialog

 this._bottomSheet.open(BottomSheetOverviewExampleSheet)
.afterDismissed().subscribe((result) => {
   console.log(result);
   console.log('Bottom sheet has been dismissed.');
 }); 
  

пример: stackblitz

Я получил свой ответ от .dismiss() функции. Просто нужно передать данные из этой функции dismiss

bottomsheet.html:

<button (click)="confirmDelete()">Delete<button>

bottomsheetComponent:

 confirmDelete(): void {
  this._bottomSheetRef.dismiss('Deleted');
  event.preventDefault();
}
  

родительский компонент:

 MatBottomSheetRef.afterDismissed().subscribe(result => {
  console.log('bottomsheet was closed');
  console.log(result); //Deleted
});