TypeError: Cannot call method 'getContext' of null in Signature App

ionic-v1
1

I am trying to insert a Signature pad into my App. The Signature logic works in plain HTML, but not when used with Ionic. I am New to this stuff, so if you have an answer, please explain clearly. Here is my code:

In my index.html:
<script src=“js/signature_pad.js”></script>
<script src=“js/app.js”></script>

In the app.js:
var canvas = document.getElementById(‘signatureCanvas’);
signaturePad = new SignaturePad(canvas);

In my signature.html:
<canvas id=‘signatureCanvas’ width=‘300’ height=‘180’></canvas>

I have read that it is because the DOM is not done loading before it tries to create the Signature canvas, and that I should move my logic “inside a function” or use “Jquery”, but I do not know how to do this, and have not found any good examples. If you know how to do this, please teach me how.

2

SOLUTION:

In the app.js, revise to:

$scope.init = function() {
   var canvas = document.getElementById('signatureCanvas');
   signaturePad = new SignaturePad(canvas);
}

THEN in the signature.html:
<ion-view title=“Signature Confirmation” ng-init=“init()”/>