如何在 ionic v1 中调用 cordova 插件

Question

我在离子v1中安装了cordova插件媒体。但是当我在浏览器中运行它时，应用程序不会定义媒体。

ionic.bundle.js:26794 ReferenceError: Media is not defined
at ChildScope.$scope.playPodcast (controllers.js:1405)
at fn (eval at compile (ionic.bundle.js:27638), <anonymous>:4:232)
at ionic.bundle.js:65427
at ChildScope.$eval (ionic.bundle.js:30395)
at ChildScope.$apply (ionic.bundle.js:30495)
at HTMLElement.<anonymous> (ionic.bundle.js:65426)
at defaultHandlerWrapper (ionic.bundle.js:16787)
at HTMLElement.eventHandler (ionic.bundle.js:16775)
at triggerMouseEvent (ionic.bundle.js:2953)
at tapClick (ionic.bundle.js:2942)

这是我的代码

$scope.playPodcast = function($audioId) {
new Media("http://www.viaviweb.in/envato/cc/online_mp3_app_demo/uploads/40655_Overboard.mp3").play();
}

Answer 1

只需快速搜索该插件的 github 页面即可显示使用该方法的方法。

特别是如果您想播放媒体文件，这是使用它的正确方法。

function playAudio(url) {
// Play the audio file at url
var my_media = new Media(url,
// success callback
function () { console.log("playAudio():Audio Success"); },
// error callback
function (err) { console.log("playAudio():Audio Error: " + err); }
);
// Play audio
my_media.play();
// Pause after 10 seconds
setTimeout(function () {
my_media.pause();
}, 10000);
}

Answer 2

好的，根据您注入脚本文件的方式，您需要以两种方式之一调用它：

1. 如果媒体插件作为索引中的脚本文件加载.html单独加载并附加到全局命名空间，则将以下内容添加到您的app.js：

angular.module('Media', [])
.factory('Media', function () {
return window.Media;
});

稍后，在 app.js 模块定义中添加以下内容：

angular.module('myApp',
[
'ionic',
'Media'
])
.run(
[
'ionicReady',
'Media',
function (
ionicReady,  
Media, 
) {
//Media initialization code here
}

这允许 angular 使用其依赖注入来确保"媒体"在您的主模块中初始化。如果要在应用程序中的其他地方使用它，则必须将其导入到其他模块中。

2. 如果你使用的是NgCordova，它为常见的Cordova插件提供了角度包装器，那么你导入它的方式与导入任何其他AngularJS库的方式相同。这里有媒体插件的示例代码。