关于ionic2自定义插件开发的文章,插件怎么调用的文章,好像网上都有,不过作为一个新手来说,从插件的开发到某个页面怎么调用,没有一个完整的过程的话,两篇没有关联的文章也容易看的迷糊。这里放到一起来方便后来人吧。

1、安装plugman

npm install -g plugman。

2、生成插件框架

plugman create --name <pluginname> --plugin_id <pluginid> --plugin_version 0.0.1

如:plugman create --name MyPlugin --plugin_id com.test.helloworld --plugin_version 0.0.1。

执行完之后会自动帮我们生成一套代码框架,这个放哪里生成都一样的,这里我以项目根目录为例。执行之后根目录多了一个文件夹,如图:

这个时候src下面是空的。

3、添加平台支持

进入插件目录,运行相应的平台支持命令

这里以android为例,ios也是一样的。

现在src下面就多了个目录了,如图:

4、安装插件

进入项目的根目录

ionic plugin add 你插件的存储路径

如:

ionic plugin list看一下,如图:

到了这里,最后一个问题来了,怎么调用呢?

1、在你的ts文件中定义一个方法,如图:

2、因为是ts,在这个ts的@Component之前,import之后,写一句declare let cordova: any;不然会报错。因为ts里要给他申明类型。

3、页面定义一个单击事件,调用fun()。

cordova.plugins.MyPlugin.coolMethod方法哪来的,你看看MyPlugin.js这个文件里面就知道了。

ionic2踩坑之自定义插件开发及调用的更多相关文章

  1. ionic2踩坑之文本域自适应高度(自定义指令,适用angular2)

    话不多说,看代码: import { Directive, ElementRef, HostListener,Input, Renderer, Component } from '@angular/c ...

  2. ionic2踩坑之订阅发布模式的实现

    原文地址:http://www.cnblogs.com/eccainiao/p/6429536.html 转载请说明. 在ionic2中实现订阅发布模式,需要用到Events. Events下面有三个 ...

  3. Springcloud踩坑记---使用feignclient远程调用服务404

    公司项目进行微服务改造,由之前的dubbo改用SpringCloud,微服务之间通过FeignClient进行调用,今天在测试的时候,eureka注册中心有相应的服务,但feignclient就是无法 ...

  4. ionic2踩坑之ionic resources失败

    网上关于ionic2怎么修改应用图标和启动画面资料也挺多的.不过大家执行ionic resources的时候不少人都执行失败了,关于执行失败的原因网上很少.下面分享一下我的经验吧. 1.看自己的项目下 ...

  5. ionic2踩坑之兼容android4.3及以下版本

    一个命令就行了 ionic plugin add cordova-plugin-crosswalk-webview --save 执行完之后重新打包. 但是如果要兼容4.0及以下的话.... 帮不了你 ...

  6. ionic2踩坑之ionic build android报错

    自己项目一直跑的好好好好的,build还是run都没问题,今天忽然一个小伙伴build一直报错.\ 错误如下: Error occurred during initialization of VMCo ...

  7. C# -- HttpWebRequest 和 HttpWebResponse 的使用 C#编写扫雷游戏 使用IIS调试ASP.NET网站程序 WCF入门教程 ASP.Net Core开发(踩坑)指南 ASP.Net Core Razor+AdminLTE 小试牛刀 webservice创建、部署和调用 .net接收post请求并把数据转为字典格式

    C# -- HttpWebRequest 和 HttpWebResponse 的使用 C# -- HttpWebRequest 和 HttpWebResponse 的使用 结合使用HttpWebReq ...

  8. Spark踩坑记——共享变量

    [TOC] 前言 Spark踩坑记--初试 Spark踩坑记--数据库(Hbase+Mysql) Spark踩坑记--Spark Streaming+kafka应用及调优 在前面总结的几篇spark踩 ...

  9. Android SDK 开发——发布使用踩坑之路

    前言 在 Android 开发过程中,有些功能是通用的,或者是多个业务方都需要使用的. 为了统一功能逻辑及避免重复开发,因此将该功能开发成一个 SDK 是相当有必要的. 背景 刚好最近自己遇到了类似需 ...

随机推荐

  1. Linux 下载安装

    安装教程:https://www.runoob.com/linux/linux-install.html Linux图形界面与命令行界面切换https://blog.csdn.net/ab522628 ...

  2. web标准介绍

    web标准介绍 web标准: w3c:万维网联盟组织,用来制定web标准的机构(组织) web标准:制作网页遵循的规范 web标准规范的分类:结构标准.表现标准.行为标准. 结构:html.表示:cs ...

  3. leetcode腾讯精选练习之最长公共前缀(九)

    最长公共前缀 题目 编写一个函数来查找字符串数组中的最长公共前缀. 如果不存在公共前缀,返回空字符串 "". 示例 1: 输入: ["flower"," ...

  4. POJ 3273 Monthly Expense二分查找[最小化最大值问题]

    POJ 3273 Monthly Expense二分查找(最大值最小化问题) 题目:Monthly Expense Description Farmer John is an astounding a ...

  5. windows系统下的渗透测试神器 -pentestbox

    Pentestbox介绍 PentestBox官网:https://pentestbox.org/zh/ 这是一个运行在windows环境下的终端,集成了绝大部分渗透测试所需要的环境 如python2 ...

  6. mysql 数据库保存\n 微信分享时不能换行

    主要因为保存的是\n 但是查询出来是\\n 所以需要把\\n替换为\n即可(不转换的话不会换行并且显示\n)

  7. Opencv笔记(八)——图像上的算数运算

    学习目标: 学习图像上的算术运算,加法,减法,位运算等. 学习函数cv2.add(),cv2.addWeighted() 等. 一.图像的加法 你可以使用函数 cv2.add() 将两幅图像进行加法运 ...

  8. 【Java杂货铺】JVM#虚拟机加载机制

    代码编译的结果从本地机器码变为字节码,是储存格式发展的一小步,却是编程语言发展的一大步--<深入理解Java虚拟机> 虚拟机把描述类的数据从Class文件加载到内存,并对数据进行校验.转化 ...

  9. OfficeidMsoViewer最新版

    点击下载 OfficeidMsoViewer最新版

  10. day13-面向对象

    #解决同一类问题,使用面向对象的思想.类是制造对象的模具,类是抽象的,我们能知道它有哪些属性(name,age,saraly),但不知道具体的属性值. #看下面代码:类Penson制造了实例化对象re ...