Ionic2中集成第三方控件Sweetalert

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

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

一、安装Typings  

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

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

二、在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;

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

 

四、在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(); //退出平台
      }
    });