2016-05-30 10 views
1

私は角度で働いています。私はjpgファイルをbase64に変換する必要があります。私はhereというCanvas Approachを使用します。私は、各画像のURLのための他のサービスを呼び出して、私はそれらのimages.Hyファイルを印刷する必要があるサービスを持っているログは空白と言うようにbase64が含まれていません。私は間違って何をしていますか?jpgからbase64へjavascript

まずサービス

.service('exportSrv', function ($cordovaPrinter, imgConvertToBase64) { 

    return { 
     prepareHtml: function (photos, itemsPerPage) { 

      //Some variables 

      switch (itemsPerPage) { 

      case 1: 
       subtitle = '1/page'; 
       head += style_100 + '</style></head>'; 
       body = '<body>'; 

       var toBase64fun = function (i) { 

        src = '../all/' + photos[i].src + '.jpg'; 

        imgConvertToBase64.toDataUrl(i, function (dataUri) { 

         console.log(dataUri); 

         if (!photos[i].iden) 
          recText = notRec; 
         if (photos[i].genre == "F") 
          icon = 'female-icon.png'; 
         else 
          icon = 'male-icon.png'; 

         var base64 = dataUri; 

         body += '<div class="container"><figure class="elements padding"><img src="' + base64 + '"alt="Den tin vrika"><figcaption><img class="icon" src="../img/all/' + icon + '"><p>Author: <i>' + photos[i].author + '</i>' + recText + '</p></figcaption></figure></div>'; 

         i++; 
         if (i <= photos.length) 
          toBase64fun(i); 
         else { 
          body += '</body>'; 
          htmlFile = '<html>' + head + body + '</html>'; 
          console.log(htmlFile); 
         } 


        }) 

       } 

       toBase64fun(0); 



      case 2: 
       { 
        //Same stuff... 
       } 

       if ($cordovaPrinter.isAvailable()) { 
        cordova.plugins.printer.print(htmlFile, 'photos: ' + subtitle, function() { 
         console.log("Print is done"); 
        }); 
       }  
       else { 
        alert("Printing is not available on device"); 
       } 

     } 
    } 

}) 

第2のサービスは

.service('imgConvertToBase64', function() { 
    function toDataUrl(url, callback, outputFormat) { 
     var img = new Image(); 
     img.crossOrigin = 'Anonymous'; 
     img.onload = function() { 
      var canvas = document.createElement('CANVAS'); 
      var ctx = canvas.getContext('2d'); 
      var dataURL; 
      canvas.height = this.height; 
      canvas.width = this.width; 
      ctx.drawImage(this, 0, 0); 
      dataURL = canvas.toDataURL(outputFormat); 
      callback(dataURL); 
      canvas = null; 
     }; 
     img.src = url; 
    } 

    return { 
     toDataUrl: toDataUrl 
    } 
}) 
+0

ではコールバックでimgConvertToBase64.toDataUrl(i, function (dataUri) { //here })

をすべての私のコードを渡すために持っていた非同期ですそしてその眺め。また、関数内にhtmlを構築するのは、指示にない限り、角度的な方法ではありません。これは指示のようには見えません。 –

+0

pdf形式で印刷するにはhtmlファイルを作成します。私はそれをデバイス上にレンダリングしません。私はそれを印刷するためにこれらのサービスを使用しています。 – Korte

答えて

0

私が間違っていたものを見つけました。 BASE64にJPGを変換する関数は、コントローラ/ディレクティブを入力してください...ので、私は私にangularJSようには見えません

else { 
      body += '</body>'; 
      htmlFile = '<html>' + head + body + '</html>'; 
      console.log(htmlFile); 

      //Here I had to add the function which actually prints my html. 
     } 
関連する問題