0

ハイブリッド アプリケーションは初めてで、複数の署名パッドを内部に実装したい Ionic フレームワークを使用してアプリケーションを開発していますng-repeat。定義したcss仕様でキャンバスが表示されますが、署名の描画がうまくいきません。

signature.html

 <div   ng-repeat="esign in consent" > 
 <div ><!--Signature Pad -->
    <canvas  id="{{'canvas'+$index}}"  ng-init="createSigPad($index)" width='300' height='180'  style='border: 1px solid blue;'></canvas>
    <div class='button-bar'>
    <a class='button button-energized' >Clear</a>
    <a class='button button-balanced' >Save</a>
    </div>
    </div> 
    </div>

controller.js

$scope.createSigPad=function(index){

     // alert(document.getElementById('canvas'+index).id);
     new SignaturePad(document.getElementById('canvas'+index));

}

Logcat にTypeError: Cannot call method 'getContext' of nullという行が表示されます

注:外部で単一の署名パッドを試したところ、正常に機能していますng-repeat

解決策を見つけるのを手伝ってください。

4

1 に答える 1

0

ng-init を ng-click に変更して、その動作を確認してみてください。問題は、ng-repeat が終了するまで待ってから createSigPad を呼び出す必要があることです。ディレクティブを使用してこれを行うことをお勧めします。

このオプションを試すことができます:あなたのhtmlは

<canvas  ng-init="createSigPad($event)" width='300' height='180'  style='border: 1px solid blue;'></canvas>

関数は次のようにする必要があります。

$scope.createSigPad=function($event){

 new SignaturePad($event.currentTarget);

}

このようにして、要素のターゲットを取得します

于 2016-01-04T07:34:33.543 に答える