Ionic2中集成第三方控件Sweetalert

Ionic2混合开发，入坑系列：Ionic2中集成第三方控件Sweetalert

注：Sweetalert2已经可以直接从npm中下载安装 npm install --save sweetalert2，以下是集成sweetalert1

1、安装Typings  

在命令行中输入：npm install -g typings

安装完成后，在命令行中输入：typings --version

2、在typings文件夹中创建一个*.d.ts文件，代码如下：

/**
 * 第三方库sweetalert声明文件
 * 
 * @author dane
 * 
 * @interface SwalStatic
 */
interface SwalStatic {
    /**
     * A basic message
     * simple:swal("Here's a message!")
     */
    (content: string);
    /**
     * A title with a text under
     * simple:swal("Here's a message!", "It's pretty, isn't it?")
     */
    (content: string, description: string);

    /**
     * A success message!
     * simple:swal("Good job!", "You clicked the button!", "success")
     */
    (content: string, description: string, type: string);

    /**
     * A warning message, with a function attached to the "Confirm"-button...
     * simple:http://t4t5.github.io/sweetalert/
     */
    (options: any, fn?: any);
}


declare var swal: SwalStatic;

3、编写引用 /// <reference path="sweetalert/index.d.ts" />

 

4、在declarations.d.ts文件中放置引用，然后就可以直接使用，例子：

    swal({
      title: '<strong>您是否退出应用？</strong>',
      text: '您自定义的内容',
      type: "warning",
      showCancelButton: true,
      animation: 'slide-from-top',
      cancelButtonText: "取消",
      confirmButtonText: '退出应用',
      html: true
    }, (isConfirm) => {
      if (isConfirm) {
        this.platform.exitApp(); //退出平台
      }
    });