我希望PDF导出的第一页专用于显示与网格当前状态关联的所有过滤器。因此，我创建了以下模板：
{{ .
<!DOCTYPE html>
<html>
<head>
<title>
Morphy
</title>
<link href="http://code.ionicframework.com/1.3.3/css/ionic.css" rel="stylesheet" type="text/css">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<!-- Latest compiled and minified CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js">
</script>
<link href="css/main.css" rel="stylesheet" type="text/css">
</link>
</link>
</meta>
</link>
</head>
<body>
<div class="modals">
<!-- The modal -->
<div aria-hidden="true" aria-labelledby="modalLabelSmall" class="modal fade" id="smallShoes" role="dialog" tabindex="-1">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button aria-label="Close" class="close" data-dismiss="modal" type="button">
<span aria-hidden="true">
×
</span>
</button>
<h4 class="modal-title" id="modalLabelSmall">
Beweging
</h4>
</div>
<div class="modal-body">
<input class="slider" id="myRange" max="100" min="1" type="range" value="50">
</input>
</div>
</div>
</div>
</div>
<div class="row icon-row">
<div class="col col-30">
<img class="icon-morphy" src="https://i.postimg.cc/kV3thPBC/beweging.png">
<svg class="donut" data-target="#smallShoes" data-toggle="modal" viewbox="0 0 42 42">
<circle class="donut-hole" cx="21" cy="21" fill="transparent" r="15.91549430918954">
</circle>
<circle class="donut-ring" cx="21" cy="21" fill="transparent" r="15.91549430918954" stroke="#d2d3d4" stroke-width="3">
</circle>
<circle class="donut-segment red-value" cx="21" cy="21" fill="transparent" r="15.91549430918954" stroke="red" stroke-dasharray="85 15" stroke-dashoffset="25" stroke-width="3">
</circle>
<circle class="donut-segment white-value" cx="21" cy="21" fill="transparent" r="15.91549430918954" stroke="white" stroke-dasharray="15 85" stroke-dashoffset="40" stroke-width="3">
</circle>
</svg>
</img>
</div>
<div class="col col-30">
</div>
<div class="col col-30">
</div>
</div>
<div class="row image-row">
<div class="col col-100">
<img class="hoverImages" id="avatar" src="https://i.postimg.cc/qzFKy3rz/avatar.png">
</img>
</div>
</div>
<div class="bar bar-header bar-light">
<h1 class="title">
bar-light
</h1>
</div>
</div>
<div class="tabs tabs-icon-top">
<a class="tab-item">
<i class="icon ion-home">
</i> Home
</a>
<a class="tab-item">
<i class="icon ion-star">
</i> Favorites
</a>
<a class="tab-item" href="/dashboard.html">
<i class="icon ion-gear-a">
</i> Settings
</a>
</div>
</body>
<script>
$("#myRange").change(function() {
var bewegingValue = $("#myRange").val();
$(".red-value").attr("stroke-dashoffset", bewegingValue);
});
</script>
</html>这个想法是，它先打印出第1页上的<script type="x/kendo-template" id="pdf-page-template">
<div class="page-template">
# if(pageNum === 1) {#
<div class="pdf-header container">
<h1>Query</h1>
<div class="row">
<div class="pdf-filters col-sm-4">
<h3>Filters</h3>
<dl class="dl-horizontal">
#= getFilters() #
</dl>
</div>
<div class="pdf-columns col-sm-3">
<h3>Columns</h3>
<ol>
#= getColumns() #
</ol>
</div>
<div class="pdf-sorting col-sm-3">
<h3>Sorting</h3>
<ol>
#= getSorting() #
</ol>
</div>
<div class="pdf-grouping col-sm-2">
<h3>Grouping</h3>
<ol></ol>
</div>
</div>
</div>
#}#
<div class="pdf-footer text-muted">
# if(pageNum > 1) {#
<h5 class="text-center">Page #= pageNum - 1 # of #= totalPages - 1 #</h5>
#}#
</div>
</div>
</script>
，然后从第2页开始，然后打印出.pdf-header，后一页的页码是第1页（因为它会从第2页开始）第1页）。
我遇到的困难是如何将分页符设置为跳过第一页的地方。我尝试将.pdf-footer添加到.page-break，然后使用以下dataBound事件：
.pdf-header但是，这仍然开始在第1页上打印网格。因此，我要向所有人提出的问题（只是重申一下问题）是如何使网格在第2页上开始打印？