Ich verwende Phonegap mit ngCordova und AngularJS. Ich versuche, das folgende Plugin (PhoneGap-Image-Resizer) zu verwenden, um mir zu helfen, einige Medien auf dem Gerät zu speichern. Mein Problem ist, dass mein Plugin mir folgende Fehler geben:Cordova Plugins undefined beim Testen auf dem Gerät
[phonegap] [console.error] Fehler: nicht definiert ist kein Objekt (Bewertung ‚$ window.imageResizer.getImageSize‘)
Dies geschieht nur, Wenn ich die App auf meinem Gerät überprüfe, wenn ich es lokal über localhost: 3000 starte, erhalte ich den Fehler nicht. Ich erhalte ähnliche Ergebnisse, wenn ich ein Konsolenprotokoll nach dem DeviceReady-Aufruf führe. Im Browser ist es in Ordnung, wo auf dem Gerät es nicht definiert ist.
Nach viel Forschung Ich habe einige gesehen, die cordova.js Datei überprüfen ist in meiner index.html verwiesen wird, die, wie Sie unten, damit er sehen kann, ist:
Index.HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
<link rel="stylesheet" type="text/css" href="css/app.css" />
</head>
<body class="app-container">
<div class="app">
<div ng-app="MyApp" class="ui-view-container">
<ui-view class="main-view">
<img src="/img/logo.png" alt="my App" class="loading-logo"/>
</ui-view>
</div>
</div>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/angular-route.js"></script>
<script type="text/javascript" src="js/angular-touch.js"></script>
<script type="text/javascript" src="js/angular-animate.min.js"></script>
<script type="text/javascript" src="js/angular-ui-router.min.js"></script>
<script type="text/javascript" src="js/angular-foundation.js"></script>
<script type="text/javascript" src="js/angular-modules/app.js"></script>
<script type="text/javascript" src="js/angular-modules/controllers/main.js"></script>
<script type="text/javascript" src="js/ng-cordova.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
</body>
</html>
Hier ist mein Teil
<div class="row collapse expanded text-center camera">
<div class="row">
<div class="small-12 columns end">
<canvas id="canvas" height="250" width="375"></canvas>
</div>
</div>
<div class="row">
<div class="small-12 columns">
<h2>Image of canvas</h2>
<img id="CanvasImage" alt="text" />
</div>
</div>
<div class="row">
<div class="small-6 columns">
<a class="button expanded" ng-click="camera()">Camera</a>
</div>
<div class="small-6 columns">
<a class="button expanded" ng-click="savecanvas()">savecanvas</a>
</div>
</div>
</div>
Hier ist mein Controller
angular.module('MyApp')
.controller('CameraCtrl', function($scope, $cordovaCamera, $rootScope, $location, $window, starFactory) {
$scope.savecanvas = function() {
document.addEventListener("deviceready", function() {
var theCanvas = document.getElementById('canvas');
var CanvasImage = document.getElementById('CanvasImage');
CanvasImage.src = theCanvas.toDataURL("image/png");
$window.imageResizer.storeImage(
function(data) { console.log('It worked!');},
function (error) {console.log("Error : \r\n" + error);},
theCanvas.toDataURL("image/png"),
{imageDataType: ImageResizer.IMAGE_DATA_TYPE_BASE64,format: ImageResizer.FORMAT_JPG}
);
}, false);
};
});
Wenn jemand mir bitte helfen könnte, zu verstehen, warum, wenn ich auf meinem Gerät bin die Plugins undefined, wenn sie gut auf den Browser funktionieren, werde ich sehr dankbar sein.