javascript - 如何在angular2中使用sweetalert2

Question

在 Angular 项目中 npm 启动后出现此错误。

app/app.component.ts(12,7): error TS2304: Cannot find name 'swal'. app/app.component.ts(21,7): error TS2304: Cannot find name 'swal'.

我创建了一个 Angular 项目。在 app.component.ts 中，我添加了甜蜜的警报代码

export class AppComponent {
deleteRow() {
      swal({
      title: 'Are you sure?',
      text: "You won't be able to revert this!",
      type: 'warning',
      showCancelButton: true,
      confirmButtonColor: '#3085d6',
      cancelButtonColor: '#d33',
      confirmButtonText: 'Yes, delete it!'
    }).then(function() {
      swal(
        'Deleted!',
        'Your file has been deleted.',
        'success'
      );
    })
  }
}

我做到了

npm install sweetalert2 --save 

并且还在index.html中添加了路径

<script src="node_modules/sweetalert2/dist/sweetalert2.min.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/sweetalert2/dist/sweetalert2.css">

Answer 1

@yurzui 给出的解决方案是唯一适用于 angular2 的解决方案。我几乎尝试了一切。 Plunker 可能会消失。我把它放在这里供其他人使用:

Plunker

1)在 index.html 之上添加这些 css 和 js

<link rel="stylesheet" href="https://npmcdn.com/sweetalert2@4.0.15/dist/sweetalert2.min.css">

<script src="https://npmcdn.com/sweetalert2@4.0.15/dist/sweetalert2.min.js"></script>

2) 将此行添加到要使用 swal 的组件中。

declare var swal: any;

在这些更改之后，我的 swal 命名空间可用并且我能够使用它的功能。

我没有导入任何 ng2-sweelalert2 或任何其他模块。