zoukankan      html  css  js  c++  java
  • 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(); //退出平台
          }
        });
  • 相关阅读:
    Python 函数知识点
    面向对象相关
    判断arg参数是否是可以被调用的
    利用U盘安装CentOS7系统
    简单模仿OpenGL中的栈的作用
    温故而知新我再一次学习库
    关于帧缓存的总结
    OGRE的相关工具和库
    OpenGL在Qt界面下的应用(helloworld)
    OpenGL加载Cg程序
  • 原文地址:https://www.cnblogs.com/xhh-lite/p/6484837.html
Copyright © 2011-2022 走看看