import { Component } from '@angular/core';
|
import swal, { SweetAlertType } from 'sweetalert2';
|
|
@Component({
|
selector: 'app-sweetalert',
|
templateUrl: './sweetalert.component.html'
|
})
|
export class SweetAlertComponent {
|
types = [ 'success', 'error', 'warning', 'info', 'question' ];
|
|
alertType(type: SweetAlertType) {
|
swal(`Try me! Example: ${type} modal`, '', type);
|
}
|
|
async alertText() {
|
const { value: name } = await swal({
|
title: 'What is your name?',
|
input: 'text',
|
inputPlaceholder: 'Enter your name or nickname',
|
showCancelButton: true,
|
inputValidator: function (value) {
|
return !value && 'You need to write something!';
|
}
|
});
|
|
if (name) {
|
swal({type: 'success', title: 'Hi, ' + name});
|
}
|
}
|
|
async alertHtml() {
|
const {value: formValues} = await swal({
|
title: 'Multiple inputs',
|
html:
|
'<input id="swal-input1" class="swal2-input">' +
|
'<input id="swal-input2" class="swal2-input">',
|
focusConfirm: false,
|
preConfirm: function () {
|
return [
|
(document.querySelector('#swal-input1') as HTMLInputElement).value,
|
(document.querySelector('#swal-input2') as HTMLInputElement).value
|
];
|
}
|
});
|
|
if (formValues) {
|
swal(JSON.stringify(formValues));
|
}
|
}
|
}
|
