angular - Multiple line shown in Matsnackbar in angular

Question

For Example:

let msg: test;let msg2 : test3; 
For Ex: alert(msg + '\n'+ msg2);  

First and second line
like wise shown the matsnackbar in angular ?                    

标签： angular

Answer 1

您可以使用snackbar.openFromComponent 方法，因此您可以根据自己的意愿设置任何html

snackbar.openFromComponent(NotificationComponent, {
  data:  {"firstLine" : "some data" , "secondLine" : "seocond data"}
});

import {Component, Inject} from '@angular/core';
import {MAT_SNACK_BAR_DATA} from '@angular/material/snack-bar';

@Component({
  selector: 'your-snack-bar',
  template: '{{ data.firstLine }} <br> {{ data.secondLine }}',  // Any Html as per your wish 
})
export class NotificationComponent{
  constructor(@Inject(MAT_SNACK_BAR_DATA) public data: any) { }
}