0

i have a json object

 [{"agence":"CTM","secteur":"Safi","statutImp":"operationnel"}]

How i can use this data with pdfmaker to print it as pdf file...because i couldn't manage to work with json object

1 Answers1

0

Here is a demo with pdfmake,

 var app = angular.module("app", []);

 app.controller("listController", ["$scope",
   function($scope) {
     $scope.data=  [{"agence":"CTM","secteur":"Safi","statutImp":"operationnel"}];
     
     $scope.export = function(){
        html2canvas(document.getElementById('exportthis'), {
            onrendered: function (canvas) {
                var data = canvas.toDataURL();
                var docDefinition = {
                    content: [{
                        image: data,
                        width: 500,
                    }]
                };
                pdfMake.createPdf(docDefinition).download("test.pdf");
            }
        });
     }
   }
 ]);
<!doctype html>
<html ng-app="app">

<head>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.22/pdfmake.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
  <script src="script.js"></script>
</head>

<body>
  <div ng-controller="listController">
    <div id="exportthis">
      {{data}}
    </div>
    <button ng-click="export()">export</button>
  </div>
</body>

</html>
Sajeetharan
  • 216,225
  • 63
  • 350
  • 396
  • thank u for the answer....but from server i get the data as json object..how can i use your exemple to fix my proble?? –  Dec 26 '16 at 16:38
  • you need to replace the sample data with your json object, thats all – Sajeetharan Dec 26 '16 at 16:40
  • i have a json object...not a simple data –  Dec 26 '16 at 16:41
  • could u make a plunker with my json data to see it works or not –  Dec 26 '16 at 16:45
  • buti want the data as table not as plane text..do u have any idea how to do that??? –  Dec 26 '16 at 17:07
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/131522/discussion-between-sajeetharan-and-imsi-imsi). – Sajeetharan Dec 26 '16 at 17:08