如何使用 angular-screenshot 打印整个 DOM 元素?
How can I print a whole DOM element using angular-screenshot?
我已经尝试 copy/paste 网页上的示例代码: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) {
...
}
问题是它不起作用,它使整个页面崩溃并抛出此错误:
Error: [$injector:unpr] http://errors.angularjs.org/1.5.0/$injector/unpr?p0=copeProvider%20%3C-%20%24scope%20%3C-%20printDocument
我真的很感激一些帮助,因为我已经坚持了很长时间并且似乎无法接近解决方案。
经过相当长的努力,我能够通过将 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 中。
我已经尝试 copy/paste 网页上的示例代码: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) {
...
}
问题是它不起作用,它使整个页面崩溃并抛出此错误:
Error: [$injector:unpr] http://errors.angularjs.org/1.5.0/$injector/unpr?p0=copeProvider%20%3C-%20%24scope%20%3C-%20printDocument
我真的很感激一些帮助,因为我已经坚持了很长时间并且似乎无法接近解决方案。
经过相当长的努力,我能够通过将 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 中。