關於ionic2自定義外掛並呼叫，其實已經有比較多的實現了，我在做這方面的工作時候也查閱了不少相關的文章，還有不少寫得比較好的。但是，很少有寫得比較詳細的，或者把其中出現的問題羅列出來的，那麼本篇博文就主要來完成這方面的不足。

建立ionic2專案

ionic start plugin_test tutorial;

通過以上程式碼建立ionic專案。
建立專案後發現對應專案沒有plugins資料夾，於是先新增一個camera外掛

ionic cordova plugin add cordova-plugin-camera;
npm install --save @ionic-native
 
/camera;

通過這兩條命令列新增可用的camera外掛，同時工程目錄下有了plugins目錄。

新增MyPlugin自定義外掛

cd 到plugins目錄，（其實應該也可以新建其它檔案目錄來放將要建立的自定義plugin檔案，我在建立的時候一開始放在了根目錄下，於是後面新增完成後執行ionic serve出現FILE_NOT_FOUND的錯誤提示）。

plugman create --name MyPlugin --plugin_id com.plugin.myPlugin --plugin_version 0.0.1;

通過以上命令列建立MyPlugin外掛。
完成建立後生成目錄結構：
—MyPlugin
|——src
|——www
|——plugin.xml
cd 到MyPlugin目錄下

plugman platform add --platform_name android;

新增android平臺外掛程式碼（ios的也類似),src目錄下多了一個android目錄，該目錄下有檔案MyPlugin.java。

plugman createpackagejson MyPlugin;

建立MyPlugin的package.json檔案，該檔案生成後可能到了父目錄下，如是則將其剪下到MyPlugin目錄下。
cd到plugins目錄下注冊MyPlugin外掛

ionic cordova plugin add MyPlugin;

外掛新增成功後或在plugins目錄下多出com.plugin.myPlugin目錄。

使用MyPlugin外掛

外掛新增成功後，則是呼叫外掛了。找到預設啟動頁新增
html程式碼：

<p>
    <button ion-button color="primary" (click)="callMyPlugin()">call my plugin</button>
</p>

ts程式碼：

import { Component } from '@angular/core';
declare let cordova: any;
@Component({
  selector: 'page-hello-ionic',
  templateUrl: 'hello-ionic.html'
})
export class HelloIonicPage {
  constructor() {
  }

  callMyPlugin(){
    cordova.plugins.MyPlugin.coolMethod("hello world",result=>alert(result),error=>alert(error));
  }
}

注意ts程式碼在import和@Component中間新增declare let cordova:any程式碼。
至於coolMethod方法，請檢視MyPlugin外掛中的MyPlugin.js定義。

執行在手機上

程式碼和環境弄好後，就是執行在真機上了，下面來看看真機的執行效果吧。
ionic cordova run android;

其他說明

1、外掛修改後，必須要重新安裝外掛後才可正常執行；
具體可能用到的命令列有：

ionic cordova plugin list 列出所有已安裝的外掛
ionic cordova  plugin remove com.xxx.myPlugin 從ionic2專案中刪除外掛
ionic cordova plugin add MyPlugin 安裝外掛到ionic2專案

2、自定義外掛只在手機上有效果，瀏覽器上不能執行，如果執行的話會報ReferenceError: cordova is not defined的錯誤。

引用文獻