Cordova插件不适用于Ionic

我正在Angular中构建一个Ionic应用程序，而且从来没有能够让插件工作。

举个例子，我尝试过使用如下所述的状态栏插件：

http://ionicframework.com/tutorials/fullscreen-apps/

但它仍然显示在我的应用程序中。 我试过了：

$ cordova plugin add org.apache.cordova.statusbar 

然后“cordova准备”，“离子运行ios”仍然没有运气。

我输入时列出的插件

 $ cordova plugin list com.ionic.keyboard 1.0.2 "Keyboard" org.apache.cordova.console 0.2.10 "Console" org.apache.cordova.device 0.2.11 "Device" org.apache.cordova.statusbar 0.1.7 "StatusBar" 

我也在使用Gulp。 我有一个包含所有开发工具的文件夹，gulp移动并将其编译到/ dist文件夹中。 我非常肯定插件是完美的移动，有什么地方我应该检查参考？

任何想法，如果有必要做的事情，以使用Ionic的Cordova插件？

Answer 1

对此的答案是我必须添加

到我的页面，就在我的脚本之上。

请注意，这个文件在开发过程中不存在，它是在运行时注入的…这就是为什么我可以解决它。 希望这有助于某人！

Answer 2

如果包括cordova.js的其他解决方案不能解决问题

我有同样的问题，但cordova.js已经包含在我的index.html 。 window.plugins总是未定义的。 然后我注意到platforms/ios/www文件夹中有一个cordova_plugins.js文件。

这是我做的：

1. $ cordova plugin add cordova-plugin-flashlight
2. $ cordova prepare
3. 在index.html cordova.js之后添加

之后我可以访问window.plugins变量。

提示：看看你的cordova_plugins.js并注意一些插件附加到cordova.plugins （例如键盘插件，见下文）其他插件附加到window.plugins （例如手电筒）

供参考 – 我的cordova_plugins.js文件看起来像这样

 cordova.define('cordova/plugin_list', function(require, exports, module) { module.exports = [ { "file": "plugins/cordova-plugin-console/www/logger.js", "id": "cordova-plugin-console.logger", "clobbers": [ "cordova.logger" ] }, { "file": "plugins/cordova-plugin-console/www/console-via-logger.js", "id": "cordova-plugin-console.console", "clobbers": [ "console" ] }, { "file": "plugins/cordova-plugin-device/www/device.js", "id": "cordova-plugin-device.device", "clobbers": [ "device" ] }, { "file": "plugins/cordova-plugin-splashscreen/www/splashscreen.js", "id": "cordova-plugin-splashscreen.SplashScreen", "clobbers": [ "navigator.splashscreen" ] }, { "file": "plugins/cordova-plugin-statusbar/www/statusbar.js", "id": "cordova-plugin-statusbar.statusbar", "clobbers": [ "window.StatusBar" ] }, { "file": "plugins/ionic-plugin-keyboard/www/ios/keyboard.js", "id": "ionic-plugin-keyboard.keyboard", "clobbers": [ "cordova.plugins.Keyboard" ], "runs": true }, { "file": "plugins/cordova-plugin-flashlight/www/Flashlight.js", "id": "cordova-plugin-flashlight.Flashlight", "clobbers": [ "window.plugins.flashlight" ] } ]; module.exports.metadata = // TOP OF METADATA { "cordova-plugin-console": "1.0.1", "cordova-plugin-device": "1.0.1", "cordova-plugin-splashscreen": "2.1.0", "cordova-plugin-statusbar": "1.0.1", "cordova-plugin-whitelist": "1.0.0", "ionic-plugin-keyboard": "1.0.7", "cordova-plugin-flashlight": "3.0.0" } // BOTTOM OF METADATA }); 

Answer 3

我在Android和iPhone模拟器上测试过这个并且工作正常。 试试这段代码：

 angular.module('starter', [ 'ionic', 'starter.controllers', ... more modules here ]) .run(function($ionicPlatform) { $ionicPlatform.ready(function() { if (window.StatusBar) { // org.apache.cordova.statusbar required StatusBar.hide(); } }); }) .... more code 

编辑：

 $ cordova plugin add org.apache.cordova.statusbar $ ionic build ios $ ionic run ios 

编辑II :(尝试使用全新的Project和iPhone模拟器）

 $ ionic start testStatusBar tabs $ cd testStatusBar/ $ cordova plugin add org.apache.cordova.statusbar $ vim www/js/app.js Edit this: if(window.StatusBar) { // org.apache.cordova.statusbar required // StatusBar.styleDefault(); StatusBar.hide(); } $ vim www/index.html add class="fullscreen" to the  element $ ionic platform add ios $ ionic build ios $ ionic emulate ios