Question

我想使用诸如{{client.name}}，{{client.id}}等json数据为客户创建信件。目前，当我尝试创建PDF时，我的json数据输入得到了未定义的值。这是我的HTML：

`<!DOCTYPE html>
 <html lang="en">
 <html ng-app="app">
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/3.1.0/css/font-awesome.min.css" />
<% include headerpdf %>
<% include navbar %>
<body>
<div id="render_me">
<div class="container">
<div ng-controller="ClientCtrl">
<div class="datagrid"><table>  
<thead> 
 <tr> 
 <th> ID </th>
 <th> Phone </th>
 <th> Address </th>
 <th> Zip </th>
 </tr>
</thead>
 <tbody>
 <tr ng-repeat="client in clients | orderBy:'id' | filter:{id:clientId} | limitTo: 1">
 <td>
 {{client.id}}
 </td>
 <td>{{client.phone}} </td>
 <td>{{client.address}}</td>
 <td>{{client.zip}}</td>
 </tr>
 </tbody>
 </table>
 <a href="#">Download Test PDF</a>
 <script type="text/javascript">
 var doc = new jsPDF();
 // We'll make our own renderer to skip this editor
 var specialElementHandlers = {
 '#editor': function(element, renderer){
    return true;
 }
 };
 doc.fromHTML($('#render_me').get(0), 15, 15, {
 'width': 170, 
 'elementHandlers': specialElementHandlers
  });
  //doc.save('Test.pdf');
  $('a').click(function(){
  doc.save('TestHTMLDoc.pdf');
  });
 </script>`

这是clientCtrl：

var myApp = angular.module('app', ['ngRoute']);

myApp.config(['$routeProvider', '$locationProvider',     function($routeProvider, $locationProvider)  {
    // configure the routing rules here
    $locationProvider.html5Mode({enabled : true, requireBase : false});
    $routeProvider.when('/client/:id', {
        controller: 'viewController'
  })}]);

myApp.controller('ClientCtrl', ['$scope', '$http', '$routeParams',    function($scope, $http, $routeParams) {
  $scope.clients = [];
  $http.get('/client').success(function(data, status, headers, config) {
    $scope.clients = data;
    if (data == "") {
        $scope.clients = [];
    }
  }).error(function(data, status, headers, config) {
      console.log("Ops: could not get any data");
  });
  $scope.addClient = function() {
    $http.post('/client', {
        name : $scope.clientName,
        age : $scope.clientAge,
        birthday : $scope.clientBirthday,
        canreceivetxt : $scope.clientcanreceivetxt,
        phone : $scope.clientPhone,
        address : $scope.clientAddress,
        ssn : $scope.clientSsn,
        }).success(function(data, status, headers, config) {
        $scope.clients.push({
        name : $scope.clientName,
        age : $scope.clientAge,
        birthday : $scope.clientBirthday,
        canreceivetxt : $scope.clientcanreceivetxt,
        phone : $scope.clientPhone,
        address : $scope.clientAddress,
        ssn : $scope.clientSsn,
        });
        $scope.clientName = '';
        $scope.clientAge = '';
        $scope.clientBirthday = '';
        $scope.clientcanreceivetxt = '';
        $scope.clientPhone = '';
        $scope.clientAddress = '';
        $scope.clientSsn = '';
    }).error(function(data, status, headers, config) {
        console.log("Ops: " + data);
    });
 };

   $scope.clientId = document.location.href.split('client/')[1];

}]);

 myApp.controller('viewController',['$scope','$http', '$location' ,  '$routeParams',function($scope, $http, $location, $routeParams){

 $http.get('/client/' + $routeParams.id).success(function(data) {
    $scope.clients = data;
    $scope.client=$scope.clients[$routeParams.id]
 })}]);

Answer 1

必须在ClientCtrl上定义

clients。你能发布你的控制器吗？也许clients不在您的$ scope或未正确初始化

编辑！

- ＆GT;最终的解决方案是将doc.fromHTML($(.....移到$('a').click(function() { ...

中

使用jsPDF使用JSON数据填充PDF

1 个答案: