如何强制页面等待Angular.html2pdf.it不会渲染AngularJS

How force page to wait for Angular. html2pdf.it does not render AngularJS

本文关键字:AngularJS it html2pdf 何强制 等待 Angular      更新时间:2024-03-03

我想将HTML页面转换为PDF。html2pdf.it似乎是一个很好的工具,因为它是开源的,我可以在自己的服务器上安装它。

只需要将url添加到路径:

http://www.html2pdf.it/?url=

我做了两页简单的纸。一个使用angularjs,另一个只使用JavaScript。在第一个Angular没有渲染的情况下,我看到了{{text}}。这很奇怪,因为angularjs.org被正确地转换为PDF。JS版本也适用。

我如何强迫它等待有角度的完成

  • Codepen Angular版本
  • Codepen JS版本

  • PDF角度版本:http://www.html2pdf.it/?url=http://s.codepen.io/M1k3l/debug/yOpgyE

  • PDF JS版本:http://www.html2pdf.it/?url=http://s.codepen.io/M1k3l/debug/vGpgRg

代码:

<html lang="en">
<head>
    <title>Minimum AngularJS page</title>
    <meta charset="UTF-8">
</head>
<body ng-app="demoApp">
    <div ng-controller="MainCtrl">
  <h1>Hello World!</h1>
          <p>{{text}}</p>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
    <script>
        angular
            .module('demoApp', [])
            .controller('MainCtrl', function($scope){
                $scope.text = "If you see this means angularjs is working";
            });
    </script>
</body>
</html>

编辑2016年4月8日:

我也不处理异步调用,例如;setTimeout()

  • Codepen setTimeout版本
  • PDF设置超时版本:

我建议您尝试使用ng-bind-html从范围变量中呈现html。类似于所附的片段。您必须包含angular-sanitize.js,还必须包含一个模块ngSanitize,正如代码片段中所做的那样。

<html lang="en">
<head>
	<title>Minimum AngularJS page</title>
	<meta charset="UTF-8">
</head>
<body ng-app="demoApp">
	<div ng-controller="MainCtrl">
  <h1>Hello World!</h1>
		  <p ng-bind-html="text"></p>
	</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
<script 
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-sanitize.js"></script> 
	<script>
		angular
			.module('demoApp', ['ngSanitize']) 
			.controller('MainCtrl', function($scope){
				$scope.text = "If you see this means angularjs is working";
			});
	</script>
</body>
</html>

谢谢,Paras