We are using angular2-toaster in our project and I have faced the problem that I can't add a custom class to toaster instance.
My toaster config looks nex way, and I want to pass customClass array with custom classes for toaster inside.
showToaster(msg: string, customClass: string | string[]) {
const toast: Toast = {
type: customClass[0],
body: msg
};
this.toasterService.pop(toast);
}
You can use ToasterConfig and then bind it to your toaster-container.
@Component({
selector: 'my-app',
template: `
<div>
<toaster-container [toasterconfig]="config"></toaster-container>
<button (click)="popToast()">pop toast</button><br/>
</div>
`,
})
export class App {
public config : ToasterConfig = new ToasterConfig({
typeClasses: {
class1: 'custom-class-1',
class2: 'custom-class-2',
class3: 'custom-class-3'
/* goes on */
}
});
/*
other stuff of component
*/
}
Then you can use it as you posted:
showToaster(msg: string, customClass: string | string[]) {
const toast: Toast = {
type: customClass[0], // class1 or class2 or class3 or etc
body: msg
};
this.toasterService.pop(toast);
}
References:
https://github.com/Stabzs/Angular2-Toaster/issues/110
https://github.com/Stabzs/Angular2-Toaster/blob/master/src/toaster-config.ts