基于網頁的移動應用的問題在于我們可以通過瀏覽器在iOS和Android上運行,用戶不能將它們安裝在設備本地,應用不能訪問本地API,如:聯系人,藍牙等等。這就是為什么我們使用Cordova結合Ionic,Cordova允許我們將應用打包為一個本地封裝,這樣允許我你們提交到應用商店,同時也可以通過插件來使用本地API。用來Cordova之后,HTML5移動應用可以做到本地應用能做的一切。
剛才也說到了,想要使用本地功能的話我們就要用到插件。Cordova提供了大量的默認插件包括:
- 設備 Device
- 網絡信息 Network Information
- 相機 Camera
- 地理信息 Geolocation
- 文件 File
- 應用內瀏覽器 In App Browser
- 多媒體 Media
- 啟動畫面 Splash Screen
同時,基本上所有的功能都有社區開發的開源插件,以下是一些比較流行的:
插件所做的基本上就是創建一個接口給JavaScript觸發本地功能的調用。所以,如果你需要用到一個不存在的Cordova插件的時候(基本上不會遇到這樣的情況),你可以自己去寫(當然也需要寫本地代碼)。
重要:大部分插件只在真實設備上才可以使用,如果你想通過ionice serve去測試Cordova插件的時候可以能會出現錯誤。
在Ionic 2中使用Cordova插件
Ionic 2中實現本地功能有兩種方法??梢酝ㄟ^安裝Cordova插件直接使用:
ionic plugin add plugin-name
然后訪問插件提供的本地功能,通常可以通過全局對象去訪問:
window.plugins.somePlugin.someMethod();
不需要導入,不需要需求(required),不需要在特定地方調用或者不需要其他任何東西 —— 一旦你通過命令行安裝好了插件之后你可以在任何地方訪問。并不是所有的插件都可以這樣去訪問,但是大部分都是這么用的。這不是Ionic 2特有的,任何Cordova項目(唯一的不同是使用cordova plugin add,而不是ionic plugin add)都可以這樣去使用。當使用正常Cordova語法的時候,在Ionic 1,Ionic 2,Sencha Touch, jQuery Mobile或者其他使用Cordova的網頁里面使用插件并沒有不同。
記住如果你這樣去使用Cordova插件的話,你的應用可能由于TypeScript警告而編譯不了。這是因為TypeScript不知道他是什么,可能你需要去安裝他對應的typings。如果想強行通過編譯的話,你可以簡單的加上:
declare var variableCausingProblems;
在類定義的裝飾器上面添加你用到的插件。
另一種方法,你可以用Ionic Native來使用Cordova插件,這是Ionic 2特有的。如果你對Ionic 1的ngCordova很熟悉,這基本就是Ionic 2里面的同一個東西。如果你不熟悉ngCordova的話,Ionic Native基本上就是通過Promise和Observables讓Cordova插件更好的與Angular 2工作。
Ionic Native在Ionic 2應用中是默認安裝的。所以你需要做的就是像平常那樣安裝你需要用到的插件,像這樣:
ionic plugin add cordova-plugin-geolocation
接下來,你需要在要用到這個插件的類里面通過Ionic Native導入此插件:
import { Geolocation } from 'ionic-native';
然后你就可以在代碼里面使用了:
Geolocation.getCurrentPosition().then((resp) => {
console.log("Latitude: ", resp.coords.latitude);
console.log("Longitude: ", resp.coords.longitude);
});
注意,上面代碼返回了一個promise,我們通過.then()設置了一個操作器(handler),如果我們使用標準的Cordova語法的話,那么是用不了這個的 -- Cordova的標準語法是使用回調函數,會比較亂。
同時需要中哦你大概ianjizhud是不是所有的Cordova插件都能通過Ionic Native使用。所有可用的組件以及如何使用,請查看Ionic Native 文檔。如果你想用的組件中Ionic Native里面沒有的話,那么你只能回頭使用標準Cordova語法了(或者你可以自己動手添加到Ionic Native)。
雖然不是強制要求,你可以在任何地方使用Ionic Native。他可能使你的代碼更整潔,更是個Angular 2生態系統(typings自動處理這些,所以TypeScript不會抱怨)。用老式的Cordova不會死人,所以也不要覺得他太糟糕。