Django 如何为 {% include %} 收集 HTML 并分配给 JS 变量

Question

我正在使用 JSPDF 将 HTML 转换为 PDF。 如果我有一个渲染页面然后单击一个按钮只是导出适当的 PDF，这非常简单，但是，我试图通过 JSPDF 创建收据并在提供 PDF 之前渲染页面不是一个好的选择。

有了这个，我正在使用 Django 基本上我想做的是使用模板的 html 来呈现我需要的收据：

例如：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.min.js"></script>

let doc = new jsPDF();
$('#click').click(function () {
   let a  = {% include 'receipt_template.html' with data=payment_data %};
   doc.fromHTML(a, 0, 0, {
      'width': 170
   });
   doc.save('receipt.pdf');
});

但这不起作用，因为我没有收集模板的 HTML，我实际上是在页面上呈现它。 我正在尝试做的事情可能吗？

Answer 1

您将 html 代码分配给您a变量。

只需引用您包含的模板 - 将此代码更新为：

let a  = `{% include 'receipt_template.html' with data=payment_data %}`;

更新

正如@Daniel Roseman所说，可能存在 escaping 问题。

在我的示例中，您不能在receipt_template.html中使用`并将其包含在其中。 你需要逃离他们。

更新 2

您也可以使用 JSX 将包含的模板直接处理为 js 变量。

然后您的代码将与此类似：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.min.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

<script type="text/babel">
  let doc = new jsPDF();
  $('#click').click(function () {
   let a  = ({% include 'receipt_template.html' with data=payment_data %});
   doc.fromHTML(a, 0, 0, {
    'width': 170
   });
   doc.save('receipt.pdf');
  });
</script>

但是，您几乎不需要使用这种方法。