Question

我有一个角度App，使用angular-ui-router Page I我看起来很好看。我正在尝试拍摄html的快照并创建一个pdf 要做到这一点，我正在使用Phantom。

我可以触发并创建PDF，但它不会呈现HTML的ng-repeat部分。

我的HTML：

<div>{{vm.hello}}</div>
<div class="row">
    <div class="col-xs-2">Heading</div>
</div>
<div class="row" ng-repeat="record in vm.records">
    <div class="col-xs-2">Space</div>
    <div class="col-xs-2" ng-bind="record.id"></div>
</div>

我的控制器在加载时触发以填充vm.records。 vm.hello是硬编码的，并且很好我的ng-repeat加载中没有任何内容。

My Node js code：

var phantom = require('phantom');
function pdf(req, res) {
  console.log('pdf function entered');
  var url = "http://myapp.com/page";
  phantom.create().then(function(ph) {
    ph.createPage().then(function(page) {
      page.viewportSize = {
        width: 1400,
        height: 1024
      };

      page.property('onLoadFinished', function(status) {
        console.log("Load Finished with status " + status);
      });

      page.open(url).then(function(status) {
          page.render('test.pdf', {
            format: 'pdf',
            quality: '100'
          }).then(function() {
            console.log("File Created");
            page.close();
            ph.exit();
          });
        });
    });
  });
  res.status(200).send();
}

任何人都可以解释为什么ng-repeat不起作用？我已经尝试过根据其他问题/答案添加延迟，但似乎无法使其正常工作。

Answer 1

在您的控制器中，您必须致电

window.callPhantom();

渲染完成时

接下来你必须像这样在$ timeout内调用它

$timeout(function(){
            window.callPhantom();
            return;
})

以避免在绑定之前调用它

具有节点和角度的幻像Js - ng-repeat不渲染

1 个答案: