Comment exporter mes données json en pdf, excel en utilisant angulaire 2

Question

J'ai créé ma table de données du site Web angular 2. Maintenant, je veux exporter mes données json au format PDF, excellent en utilisant un cadre angulaire.

S'il vous plaît me donner une suggestion comment puis-je réaliser cela ou tout lien si vous avez.

Cordialement

Answer 1

Utilisez jsPDF convertir JSON au format PDF.

et AlaSQL pour convertir JSON en Excel (* .xls, * .xlsx).

Answer 2

(function() { 
    'use strict'; 

    angular.module('ngJsonExportExcel', []) 
     .directive('ngJsonExportExcel', function() { 

      return { 
       restrict: 'AE', 
       scope: { 
        data : '=', 
        filename: '=?', 
        reportFields: '=', 
        separator: '@' 
       }, 

       link: function (scope, element) { 
        scope.filename = !!scope.filename ? scope.filename : 'SalesReport'; 

        var fields = []; 
        var header = []; 
        var separator = scope.separator || ','; 

        angular.forEach(scope.reportFields, function(field, key) { 
         if(!field || !key) { 
          throw new Error('error json report fields'); 
         } 

         fields.push(key); 
         header.push(field); 
        }); 

        element.bind('click', function() { 
         var bodyData = _bodyData(); 
         var strData = _convertToExcel(bodyData); 

         var blob = new Blob([strData], {type: "text/plain;charset=utf-8"}); 

         return saveAs(blob, [scope.filename + '.csv']); 
        }); 

        function _bodyData() { 
         var data = scope.data; 
         var body = ""; 
         angular.forEach(data, function(dataItem) { 
          var rowItems = []; 

          angular.forEach(fields, function(field) { 
           if(field.indexOf('.')) { 
            field = field.split("."); 
            var curItem = dataItem; 

            // deep access to obect property 
            angular.forEach(field, function(prop){ 
             if (curItem !== null && curItem !== undefined) { 
              curItem = curItem[prop]; 
             } 
            }); 

            data = curItem; 
           } 
           else { 
            data = dataItem[field]; 
           } 

           var fieldValue = data !== null ? data : ' '; 

           if (fieldValue !== undefined && angular.isObject(fieldValue)) { 
            fieldValue = _objectToString(fieldValue); 
           } 

           if(typeof fieldValue == 'string') { 
            rowItems.push('"' + fieldValue.replace(/"/g, '""') + '"'); 
           } else { 
            rowItems.push(fieldValue); 
           } 
          }); 

          body += rowItems.join(separator) + '\n'; 
         }); 

         return body; 
        } 

        function _convertToExcel(body) { 
         return header.join(separator) + '\n' + body; 
        } 

        function _objectToString(object) { 
         var output = ''; 
         angular.forEach(object, function(value, key) { 
          output += key + ':' + value + ' '; 
         }); 

         return '"' + output + '"'; 
        } 
       } 
      }; 
     }); 
})(); 

Answer 3

Peut-être que vous devriez chercher comment exporter votre data-table à un objet de format JSON alors il y a beaucoup d'exemples comment convertir un JSON au format PDF/CSV et pourrait être utilisé dans natif JavaScript ou TypeScript. Ces liens peuvent vous aider: Converting json to pdf using js frameworks et http://jsfiddle.net/hybrid13i/JXrwM/