AngularJs 中带有微调器的甜蜜警报对话框
[英]Sweet alert dialog with spinner in AngularJs
问题描述
I am trying to display a spinner in a sweet alert dialog something close to Bootstrap modal dialog ( http://jsfiddle.net/D6rD6/5/ )
我试图在接近 Bootstrap 模式对话框的sweet alert对话框中显示一个微调器（ http://jsfiddle.net/D6rD6/5/ ）
The closest i could come up with is something like this :我能想到的最接近的是这样的：
SweetAlert.swal({
title: '<small>Import errors occurred !</small>',
text: '<i class="fa fa-spinner" aria-hidden="true"></i>',
html: true,
customClass: 'manual-upload-errors-swal-width'
});
If this is not possible whats the closest and best solution ?如果这是不可能的，那么最接近和最好的解决方案是什么？
2 个解决方案
解决方案1
7 已采纳 2016-11-01 19:14:01
The original sweet alert plugin is unsupported, I suggest you using SweetAlert2 plugin.原版sweet alert插件不支持，建议使用SweetAlert2插件。
Migration is simple, here's the migration guide: Migration from SweetAlert to SweetAlert2迁移很简单，这里是迁移指南： 从 SweetAlert 迁移到 SweetAlert2
In SweetAlert2 there's swal.showLoading() , so you can show loading modal as easy as:在 SweetAlert2 中有swal.showLoading() ，所以你可以像这样简单地显示加载模式：
Swal.fire('Please wait') Swal.showLoading()
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
解决方案2
0 2020-03-06 08:35:34
This code works fine for showing Loading Spinner.此代码适用于显示加载微调器。
const showLoading = function() { Swal.fire({ title: 'Please Wait', allowEscapeKey: false, allowOutsideClick: false, background: '#19191a', showConfirmButton: false, onOpen: ()=>{ Swal.showLoading(); } // timer: 3000, // timerProgressBar: true }); }; showLoading(); <html> <head> <meta charset="UTF-8"/> <meta name="viewport" content="width=device-width, initial- scale=1.0"/> <!-- Compiled and minified JavaScript --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script> <link href="https://cdn.jsdelivr.net/npm/@sweetalert2/theme-dark@3" rel="stylesheet"> </head> </html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.