import { DaffToastService } from '@daffodil/design/toast'
Service to display toasts.
@Injectable()
class DaffToastService implements OnDestroy {
open(
toast: DaffToastData
configuration?: Partial<DaffToastConfiguration>
): DaffToast
close(toast: DaffToast): void
}
DaffToast
Opens the toast.
Parameter | toast: DaffToastData |
---|---|
Description | Data that can be shown on a toast. |
Parameter | configuration: Partial<DaffToastConfiguration> |
---|---|
Description | Additional configuration options such as duration. The default duration is set to 5000ms. |
void
Closes the toast.
Parameter | toast: DaffToast |
---|---|
Description | The instance of toast that you wish to close. |
import {
ChangeDetectionStrategy,
Component,
EventEmitter,
OnInit,
} from '@angular/core';
import {
DaffToast,
DaffToastAction,
DaffToastService,
} from '@daffodil/design/toast';
@Component({
selector: 'default-toast',
templateUrl: './default-toast.component.html',
styles: [],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DefaultToastComponent implements OnInit {
private toast: DaffToast;
constructor(private toastService: DaffToastService) {}
closeToast = new EventEmitter<DaffToastAction>();
open() {
this.toast = this.toastService.open({
title: 'Update Available',
message: 'A new version of this page is available.',
actions: [
{ content: 'Remind me later', type: 'flat', size: 'sm', eventEmitter: this.closeToast },
],
});
}
ngOnInit() {
this.closeToast.subscribe(() => {
this.toastService.close(this.toast);
});
}
}