sweetalert_1.default 不是函数：Angular 5答案

【问题标题】：sweetalert_1.default is not a function : Angular 5sweetalert_1.default 不是函数：Angular 5
【发布时间】：2018-11-20 19:12:19
【问题描述】：

我要在官方link 中发现 SweetAlert，所以我想在我的应用 angular5 中使用它。

我是这样安装的：

npm install sweetalert --save

我已将它导入到我的组件中：edit-client.component 与此：

  import swal from 'sweetalert';

这是我尝试使用的文件 editClient.component.ts ：

import swal from 'sweetalert';

Component({
  selector: 'app-edit-clients',
  templateUrl: './edit-clients.component.html',
  styleUrls: ['./edit-clients.component.scss']
})
export class EditClientsComponent implements OnInit {

EditClient(){
    this.clientService.updateClient(this.client)
      .subscribe(data=>{
        console.log(data);

        swal('mise a jour effecture !');

        this.router.navigate([ '../../../list' ], { relativeTo: this.activatedRoute });
        },err=>{
        console.log(err);
        alert("Probleme");
      })
  }


}

但是在运行这个例子时，我看不到警报，而是得到一个错误：

RROR TypeError: sweetalert_1.default is not a function
    at SafeSubscriber.eval [as _next] (edit-clients.component.ts:39)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:240)
    at SafeSubscriber.next (Subscriber.js:187)
    at Subscriber._next (Subscriber.js:128)
    at Subscriber.next (Subscriber.js:92)

我做错了什么？

【问题讨论】：

它似乎工作正常。这是堆栈闪电战stackblitz.com/edit/…
太奇怪了，我们用同样的方式做，但我一直收到同样的错误。
尝试像这样导入 - import * as sweetalert from 'sweetalert';
然后是 sweetalert("Hello world!");
我尝试这样做，但 sweetalert("Hello world!") 甚至在运行之前就显示此消息：不能不调用类型缺少调用签名的表达式

标签： angular angular5 frontend sweetalert sweetalert2

【解决方案1】：

对于那些面临同样问题的人，我改为导入：

import * as _swal from 'sweetalert';
import { SweetAlert } from 'sweetalert/typings/core';
const swal: SweetAlert = _swal as any;

然后使用：

swal('hello world');

这解决了问题。

【讨论】：

【解决方案2】：

就我而言，我是从“sweetalert”导入的。一旦我更正了 import 语句，问题就消失了。

正确的导入行是。

import swal from "sweetalert2";

【讨论】：