angular - SweetAlert 删除 angular5 中的错误
问题描述
使用 angular5,我试图在我的代码中使用 SweetAlert 删除选项,但我遇到了一些错误:
我正在使用与官方链接中相同的功能
这是 .ts 中的代码
import * as _swal from 'sweetalert';
import { SweetAlert } from 'sweetalert/typings/core';
const swal: SweetAlert = _swal as any;
@Component({
selector: 'app-clients',
templateUrl: './clients.component.html',
styleUrls: ['./clients.component.scss']
})
export class ClientsComponent implements OnInit {
pageClients:any;
ngOnInit() {
this.doSearch();
this.getAllClientsList();
}
delete(p:Clients){
swal({
title: "Are you sure?",
text: "Once deleted, you will not be able to recover this imaginary file!",
icon: "warning",
buttons: true,
dangerMode: true,
})
.then((willDelete) => {
if (willDelete) {
this.clientService.deleteClient(p.id)
.subscribe(data=>{
this.pageClients.content.splice(
this.pageClients.content.indexOf(p),1
);
},err=>{
console.log(err);
})
swal("Poof! Your imaginary file has been deleted!", {
icon: "success",
});
} else {
swal("Your imaginary file is safe!");
}
});
}
}
如何解决这个问题?
编辑
delete(p:Clients){
swal({
title: "are you sur ?",
text: " nce deleted, you will not be able to recover this imaginary file!!",
type: 'warning',
showConfirmButton: true,
showCancelButton: true
})
.then((willDelete) => {
if (willDelete) {
this.clientService.deleteClient(p.id)
.subscribe(data=>{
this.pageClients.content.splice(
this.pageClients.content.indexOf(p),1
);
},err=>{
console.log(err);
})
swal({
title: " great",
type: 'success',
});
} else {
swal("you have not deleted this client yet ");
}
});
}
出现此警报时,无论何时选择“确定”或“取消”,我总是会收到“很棒”的警报。
当我试图打印这个时,我明白它总是执行第一个 if(willDelete),所以无论我选择 ok 还是 cancel,这个客户端都会被删除。
解决方案
当您尝试使用swal
功能时,您只需要提供SweetAlertOptions
接口上可用的属性 它有很多属性,但这些属性不存在
icon: "warning",
buttons: true,
dangerMode: true,
相反,您可以使用:
type :'warning',
showConfirmButton: true,
showCancelButton: true,
最终代码
swal({
title: "Are you sure?",
text: "Once deleted, you will not be able to recover this imaginary file!",
type: 'warning',
showConfirmButton: true,
showCancelButton: true
})
.then((willDelete) => {
if (willDelete) {
this.clientService.deleteClient(p.id)
.subscribe(data=>{
this.pageClients.content.splice(
this.pageClients.content.indexOf(p),1
);
},err=>{
console.log(err);
})
swal({title:"Poof! Your imaginary file has been deleted!",
type: "success",
});
} else {
swal("Your imaginary file is safe!");
}
});
只是要确定
我正在使用以下 src ngx-sweetalert2
npm install --save sweetalert2 @toverux/ngx-sweetalert2
推荐阅读
- html - 发生变化时数据未显示在表格中,角度
- node.js - 在 Vercel 上部署 Expressjs + Nextjs 应用程序
- reactjs - 从firebase中的字段获取值
- mongodb - 将 MongoDB 与 Firebase 集成
- c# - 如何检测接口和抽象类之间的区别?
- swift - 如何在 SwiftUI 中为 navigationBarHidden 设置动画?
- c# - 在 C# 中以编程方式安装 FTDI 驱动程序
- flutter - 从 Firestore 中检索数据并将其传递给变量。扑
- r - 如何将绘图翻转 90 度
- python - Apscheduler 与 Django 一起运行,但不与 gunnicorn 一起运行