2014-09-17 14 views
6

Ho un problema ora su JSReport .. Presupposto che ho già un'API ... Quello che voglio ora è come collegarlo al mio lato client che usa AngularJS.Come connettere jsReport in AngularJS?

Se uso Postman restituirà un file pdf che è quello che voglio. Ma il mio problema è come per dimostrare che è la mia pagina quando posto utilizzando angularjs ..

Ho un codice come questo:

controller

$scope.Print = function() { 
     authService.print().then(function(result){ 
      var _result = result; 
     }); 
    }; 

Servizio

var _print = function() { 
     var data = { "template": { "shortid": "byQtwHLPQ" } }; 
     return $http.post("http://192.168.8.87/api/report", data).then(function (result) { 
      return result; 
     }); 
    }; 

authServiceFactory.print = _print; 

Ora ho quel codice e non funziona ... ho pensato che non ha alcun ritorno quindi rimuovo il ritorno e basta pubblicare ma ancora non ha funzionato e anche il download del pdf non ha funzionato su di esso.

Chiunque può aiutare per favore ...

+0

come hai creato il rapporto? – Sajeetharan

risposta

4

Utilizzare come questo ..

controller

var parameter = { "template": { "shortid": "ZkMoslfdX" }}; 
     PrintService.Print(parameter).then(function (result) { 
      var file = new Blob([result.data], { type: 'application/pdf' }); 
      var fileURL = URL.createObjectURL(file); 
      $scope.content = $sce.trustAsResourceUrl(fileURL); 
     }); 

Servizio

var reportUrl = "http://192.168.8.87/api/report"; 
    var _print = function (parameter) { 
     return $http.post(reportUrl, parameter, { responseType: 'arraybuffer' }).success(function (response) { 
      return response; 
     }); 
    }; 

L'idea principale è che il result.data viene convertito in un blob e creare un objectURL in modo che sia leggibile e al tag object e $sce.trustAsResourceUrl usato a fidarsi angolare al tuo URL

HTML

<object data="{{content}}" type="application/pdf" style="width:100%;height:80%"></object> 

Mi riferisco a questo post AngularJS: Display blob (.pdf) in an angular app per chiarimenti, basta leggerlo.

Problemi correlati