import { Component } from '@angular/core' ; import { MatBottomSheet , MatBottomSheetRef } from '@angular/material' ; title @ Component ( { selector : 'bottom-sheet-overview-example' , templateUrl : 'bottom-sheet-overview-example.html' , styleUrls : [ 'bottom-sheet-overview-example.css' ] , } ) export class BottomSheetOverviewExample { constructor ( private bottomSheet ) { } openBottomSheet ( ) { this . bottomSheet . open ( BottomSheetOverviewExampleSheet ) ; } } @ Component ( { selector : 'bottom-sheet-overview-example-sheet' , templateUrl : 'bottom-sheet-overview-example-sheet.html' , } ) export class BottomSheetOverviewExampleSheet { constructor ( private bottomSheetRef ) { } openLink ( event ) { this . bottomSheetRef . dismiss ( ) ; event . preventDefault ( ) ; } }