如何包含和使用 cordova 插件答案

【问题标题】：How to include and use cordova plugins如何包含和使用 cordova 插件
【发布时间】：2017-04-08 03:14:08
【问题描述】：

我在 ionic 应用程序中遇到了 cordova 插件。整天在谷歌上搜索，还没有大获全胜。

这就是我想要做的 - 在我的应用程序中打开一个网页，并显示导航栏。我发现cordova-themeable 可能会解决这个问题

...然而...

我已经安装了

$ cordova plugin add cordova-plugin-themeablebrowser

好的，它存在

$ cordova plugin list
cordova-plugin-camera 2.2.0 "Camera"
cordova-plugin-compat 1.0.0 "Compat"
cordova-plugin-console 1.0.3 "Console"
cordova-plugin-device 1.1.2 "Device"
cordova-plugin-splashscreen 3.2.2 "Splashscreen"
cordova-plugin-statusbar 2.1.3 "StatusBar"
cordova-plugin-themeablebrowser 0.2.15 "ThemeableBrowser"
cordova-plugin-whitelist 1.2.2 "Whitelist"
ionic-plugin-keyboard 2.2.0 "Keyboard"

现在，我正在尝试在控制器功能中使用它

$scope.doStuff = function doStuff() {
    cordova.ThemeableBrowser.open('http://apache.org', '_blank', {
        ...

并在我的 .html 文件中调用它

<ion-item ng-click="doStuff()">

我收到以下错误

ReferenceError: cordova is not defined at Scope.doStuff

在我的 index.html 中，我有

<script src="lib/ionic/js/ionic.bundle.js"></script>

<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

<script src="js/app.js"></script>

请帮忙，谢谢

【问题讨论】：

您是否在项目中添加了cordova？
@matt93 确保在 ionicPlatform.ready 函数中调用插件代码
@Gandhi 谢谢，我在我的函数中添加了它： $scope.doStuff = function doStuff() { ionic.Platform.ready(function () { cordova.ThemeableBrowser.open('apache.org' , '_blank', { ... 但仍然 - cordova 没有在 ionic 实验室中定义，在模拟器中它什么都不做。我想知道是否缺少一些依赖项，或者我在 html 文件中调用它的方式是错误的？？跨度>
甚至可以使用cordova.ThemeableBrowser.open('apache.org', '_blank', {..});在我的控制器中？
@matt93 我没有使用 Ionic 的经验，因为我只使用 vanilla cordova 框架。但我了解到的是不需要明确添加平台就绪。在空白的 Ionic 模板项目中，它默认在 app.js 中可用你只需要在其中调用插件代码

标签： angularjs cordova ionic-framework phonegap-plugins cordova-plugins

【解决方案1】：

你能验证插件在你的 config.xml 中吗？

它应该看起来像这样：

    <plugin name="com.phonegap.plugins.example">
    <param name="APIKey" value="12345678" />
    <param name="APISecret" value="12345678" />
    </plugin>

【讨论】：

我在我的 .. ./platforms/android/res/xml/config.xml 但在 .../platforms/ios/appName/config.xml 中没有类似的内容，并且我的 .../appName/config.xml 中没有任何功能。请问你能更具体地配置一下吗？提前感谢
更新 - 好的，我再次使用 --save 选项添加了插件，现在它在我的 app/config.xml 中：，但仍然无法正常工作。既不在模拟器也不在模拟器中：/

【解决方案2】：

会将此添加为评论，但没有足够的代表，仅发布，因为我看不到任何提及。

确保将其正确注入到您的应用程序中，考虑到错误或未定义的cordova，我假设这可能是一个问题。我找不到对它的任何特定引用，但考虑到它是建立在 inappbrowser 之上的，我会假设 DI 是 $cordovaInAppBrowserProvider。

在阅读文档时，来自他们的 gitgub FAQ “我刚刚安装了这个插件，为什么它只是显示一个空白工具栏？

此插件的目的是让您可以按照自己的方式设置应用内浏览器的样式。这不是你安装这个插件的原因吗？因此，它没有任何默认值。每个 UI 元素都需要由您设置样式，否则它会被隐藏。这也避免了默认图像污染你的资源包。”

【讨论】：

【解决方案3】：

添加一个你做对的插件，即如果你想使用cordova adomb plugin：

cordova plugin add cordova-admob

关于错误：你是在浏览器调试还是在真机调试？通常在浏览器中，你应该使用

cordova platform add browser
phonegap serve

（我建议您使用cordova serve 的phonegap serve insetad，因为有时效果更好，但不应该有所作为）

调试应用程序的另一种方法是使用android remote debug。

【讨论】：