Стили в MatSnackBar открываются из компонента - PullRequest
0 голосов
/ 24 сентября 2018

Я ищу способ сделать следующее: чтобы показывать уведомления, я хочу реализовать собственный SnackBar.Я следовал официальному документу ( здесь ) и создал простой снэк-бар с некоторой пользовательской конфигурацией.

this.snackBar.open('Message one', 'OK', configSuccess);

export const configSuccess: MatSnackBarConfig = {
  panelClass: 'style-success',
  duration: 10000,
  horizontalPosition: 'left',
  verticalPosition: 'bottom'
};

Это отлично работает, но я хочу другой дисплей в SnackBar (в частности, отправлять данные и отображать две кнопки).Следуя документации, я создаю компонент и открываю из него свой SnackBar:

/*...*/    
this.snackBar.openFromComponent(SnackbarMessageComponent, {
              data: 'Message one',
            });
/*...*/

@Component({
  selector: 'app-snackbar-message',
  templateUrl: './snackbar-message.component.html',
  styleUrls: ['./snackbar-message.component.scss']
})
export class SnackbarMessageComponent implements OnInit {

  constructor(@Inject(MAT_SNACK_BAR_DATA) public data: any) { }

  ngOnInit() {
  }

Все хорошо, но теперь у меня проблема.Я хочу передать этой новой SnackBar конфигурацию, которую я определил ранее (например, config Success), но в официальных документах и ​​Google я ничего не нашел.

Есть ли способ сделать это без необходимости определять его глобально?Может кто-нибудь направить меня или сказать, куда мне идти?Заранее спасибо!

1 Ответ

0 голосов
/ 25 сентября 2018

Наконец, благодаря shivensinha4 в этом выпуске , у меня есть ключ:

Он также может предоставлять стили для функции openFromComponent, напримерэто:

this.snackBar.openFromComponent(SnackbarMessageComponent, {
  data: 'Message one',
  ...this.configSuccess
});

Вот рабочий пример: Stackblitz

...