我是离子新手，当我尝试开发基于Android的应用时，我无法处理这个问题。
此应用程序是使用离子与jspdf.debug.js和html2canvas.js构建的
当我在设备上测试时，结果是一个空白的pdf文件，我对如何解决这个问题一无所知。
有人能帮我一把吗？
贝娄，代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<!--<link href="css/style.css" rel="stylesheet">-->
<link href="css/styles.for.all.css" rel="stylesheet" />
<link href="css/index.css" rel="stylesheet" />
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!--Signature Components-->
<link href="css/jquery.signaturepad.css" rel="stylesheet">
<script src="js/jquery.min.js"></script>
<script src="js/jquery.signaturepad.js"></script>
<script src="js/jquery.signaturepad.min.js"></script>
<script src="js/json2.min.js"></script>
<script src="js/jspdf.debug.js"></script>
<script src="js/html2canvas.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.sigPad').signaturePad({ drawOnly: true });
});
</script>
<script src="js/index.js"></script>
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!--ng-cordova-->
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
</head>
<body ng-app="starter"> <!--onload="prepareCanvas()"--> <!--onload="onLoad()"-->
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">My App</h1>
</ion-header-bar>
<ion-content>
<!--<form>-->
<div id="content" class="list">
<div class="off-screen" style="width: 100%; height: 100%">
</div>
<label class="item item-input">
<input type="text" placeholder="Lorem Ipsum Lorem Ipsum(Lorem Ipsum) - Lorem Ipsum" disabled="disabled">
</label>
<label class="item item-input">
<input type="text" placeholder="Lorem Ipsum. Lorem Ipsum: Lorem Ipsum - Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum" disabled="disabled">
</label>
<label class="item item-input">
<input type="text" placeholder="Lorem Ipsum: Lorem Ipsum Lorem Ipsum Lorem Ipsum" disabled="disabled">
</label>
<label class="item item-input item-floating-label">
<span class="input-label">Equipe</span>
<input type="text" placeholder="Nome da Equipe">
</label>
<label class="item item-input item-floating-label">
<span class="input-label">Data</span>
<input type="text" placeholder="Data">
</label>
<label class="item item-input item-floating-label">
<span class="input-label">Area</span>
<input type="text" placeholder="Área">
</label>
<label class="item item-input item-floating-label">
<span class="input-label">Local</span>
<input type="text" placeholder="Local">
</label>
<label class="item item-input item-floating-label">
<span class="input-label">Atividade</span>
<input type="text" placeholder="Ativididade">
</label>
<label class="item item-input item-floating-label">
<span class="input-label">TipoNumDoc</span>
<input type="text" placeholder="Tipo e N° Documento">
</label>
<label class="item item-input item-floating-label">
<span class="input-label">Despachante</span>
<input type="text" placeholder="Despachante">
</label>
<div class="item item-divider">
Planejamento
</div>
<label class="item item-radio">
<input type="radio" name="group">
<div class="item-content">
Sim
</div>
<div class="item-content">
Não
</div>
<i class="radio-icon ion-checkmark"></i>
</label>
<div class="sigPad">
<!--<p class="drawItDesc current">Assine no quadro abaixo</p>-->
<ul class="sigNav">
<!--<li class="typeIt"><a href="#type-it" class="current">Type It</a></li>-->
<li class="drawIt"><a href="#draw-it" class="current">Assinar</a></li>
<li class="clearButton"><a href="#clear">Limpar</a></li>
</ul>
<div class="sig sigWrapper">
<div class="typed"></div>
<canvas class="pad" width="300" height="55"></canvas>
<input type="hidden" name="output" class="output">
</div>
</div>
</div>
<canvas id="canvas"> </canvas>
</ion-content>
<div class="bar bar-footer">
<button class="button" onclick="prepareAPI()">Criar PDF Ionic</button>
<div class="title">Title</div>
<button class="button button-clear">Limpar</button>
</div>
</ion-pane>
</body>
<script type="text/javascript">
function prepareAPI() {
alert("onDeviceReady");
document.addEventListener("deviceready", createPdf(), false);
}
function createPdf() {
var d_canvas = document.getElementById('canvas');
var context = d_canvas.getContext('2d');
var div = document.getElementById('content'); //.parentNode.style.overflow = 'visible';
context.width = div.offsetWidth;
context.height = div.offsetHeight;
//FIRST GENERATE THE PDF DOCUMENT
console.log("generating pdf...");
alert("generating pdf...");
html2canvas(content, {
onrendered: function(d_canvas) {
document.body.appendChild(d_canvas);
//document.body.removeChild(clone);
console.log("Pegou html2canvas");
var imgData = d_canvas.toDataURL('image/png', context.width, context.height);
//var imgData = d_canvas.toDataURL('image/png', context.width, context.height);
doc = new jsPDF('p', 'mm');
console.log( imgData );
doc.addImage(imgData, 'PNG', 10, 10, div.offsetWidth, div.offsetHeight);
//doc.addImage(imgData, 'PNG', 10, 10, div.offsetWidth, div.offsetHeight);
pdfOutput = doc.output('blob');
saveFile(pdfOutput);
}
});
//NEXT SAVE IT TO THE DEVICE'S LOCAL FILE SYSTEM
var saveFile = function(pdfOutput) {
console.log("file system...");
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSystem) {
console.log(fileSystem.name);
console.log(fileSystem.root.name);
console.log(fileSystem.root.fullPath);
fileSystem.root.getFile("test.pdf", {create: true}, function(entry) {
var fileEntry = entry;
console.log(entry);
alert("ENTRY " + entry);
entry.createWriter(function(writer) {
writer.onwrite = function(evt) {
console.log("write success");
alert("write success");
};
console.log("writing to file");
alert("writing to file");
writer.write( pdfOutput );
alert("PDFOUTPUT" + pdfOutput);
}, function(error) {
console.log(error);
alert(error);
});
}, function(error){
console.log(error);
alert(error);
});
},
function(event){
console.log( evt.target.error.code );
});
}
}
</script>
</html>