代码之家  ›  专栏  ›  技术社区  ›  Mauricio Cárdenas

如何使用角截图打印整个dom元素?

  •  0
  • Mauricio Cárdenas  · 技术社区  · 7 年前

    我已经尝试在网页上复制/粘贴示例代码: https://weihanchen.github.io/angular-screenshot/ 问题是他们使用了一个完整的控制器,我的控制器被视图分隔开。我就是这样把它们添加到我的“main”js中的:

        .state("main.pallet", {
            url: "/palletize",
            templateUrl: "app/views/pallet.html",
            data: {pageTitle: 'Entarimado.'},
            controller: "Pallet",
            resolve: {
                deps: ['$ocLazyLoad', function($ocLazyLoad) {
                    return $ocLazyLoad.load({
                        name: 'TepaPrime',
                        insertBefore: '#ng_load_plugins_before', // load the above css files before '#ng_load_plugins_before'
                        files: [
                            'app/js/filters/filters.js',
                            'app/js/directives/numericFormat.js',
                            'app/js/directives/trimText.js',
                            'app/js/directives/nextOnEnter.js',
                            'app/js/factories/crud.factory.js',
                            'app/js/controllers/modals/palletContent.js',
                            'app/js/controllers/pallet.js',
                            'app/js/services/printDocument.js'
                        ]                    
                    });
                }]
            }
        })
    

    这是我的printdocument.js,我在这里粘贴了示例中的代码(并对其进行了修改以使其正常工作):

    'use strict';
    function appController($scope) {
      var self = this;
      self.fullScreenApi;
      self.downloadFull = downloadFull;
      this.downloadFull = function() {
          if (self.fullScreenApi) self.fullScreenApi.downloadFull();
       }
       return downloadFull;
    }
    angular
        .module('TepaPrime')
        .service('printDocument', appController);
    

    然后通过执行以下操作将其注入视图的控制器:

    function Pallet($rootScope, $scope, $state, $timeout, $uibModal, $http, $filter, crud, sessionService, printDocument) {
      ...
    }
    

    问题是它不起作用,导致整个页面崩溃并抛出此错误:

    错误:[$injector:unpr] http://errors.angularjs.org/1.5.0/ $注射器/UNPR?P0=copeprovider%20%3c-%20%24范围%20%3c-%20printdocument

    我真的很感激你的帮助,因为我已经被困在这里很长时间了,似乎无法找到解决办法。

    1 回复  |  直到 7 年前
        1
  •  0
  •   Mauricio Cárdenas    7 年前

    经过很长一段时间的挣扎,我通过改变html

          <button class="btn btn-info" ng-if="appCtrl.isFullOpen" ng-click="appCtrl.downloadFull()">
            <i class="material-icons">Descargar tabla</i>
          </button>
    

    到:

          <button class="btn btn-info" ng-if="appCtrl.isFullOpen" ng-click="appCtrl.fullScreenApi.downloadFull()">
            <i class="material-icons">Descargar tabla</i>
          </button>
    

    问题是downloadfull()函数在fullscreenapi中。