Javascript 打印函数在部分视图之前调用
我想做的是在新窗口中打开部分视图并调用print函数,但问题是部分视图在print函数之后呈现,所以我总是得到一个空白页。我尝试了Javascript 打印函数在部分视图之前调用,javascript,angularjs,Javascript,Angularjs,我想做的是在新窗口中打开部分视图并调用print函数,但问题是部分视图在print函数之后呈现,所以我总是得到一个空白页。我尝试了$timeout函数,但得到了相同的结果。现在,我有这个,但这是一个黑客解决方案,我不喜欢它: $scope.print = function() { setTimeout(function() { print() }, 1000); } 这是我尝试打开的页面的html: <div id="printWrapper" style
$timeout
函数,但得到了相同的结果。现在,我有这个,但这是一个黑客解决方案,我不喜欢它:
$scope.print = function() {
setTimeout(function() {
print()
}, 1000);
}
这是我尝试打开的页面的html:
<div id="printWrapper" style="background-color:white;" ng-controller="accountContentController" ng-init="print()">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<!-- HEADER -->
<tr>
<td>
<img id="imgLogo" src="@Model.TicketPayOut.Logo" />
</td>
</tr>
<!--HEADER-->
<tr>
<td>
<label id="lblTerminalId" class="left-position padding-top-3 padding-left-3 text-style">@Translator.Translate("TERMINAL")</label>
<span class="left-position padding-top-3 text-style">:</span>
<label id="lblTerminalIdValue" class="left-position padding-top-3 padding-left-3 text-style"></label>
<div style="clear:both"></div>
<label id="lblTerminalName" class="left-position padding-left-3 text-style">@Translator.Translate("BET_OFFICE")</label>
<span class="left-post text-style">:</span>
<label id="lblTerminalNameValue" class="left-position padding-left-3 text-style"></label>
<label id="lblTerminalCityAddress" class="left-position padding-left-3 text-style" style="clear:both;"></label>
<label id="lblCompanyInfo" class="center-position text-style" style="clear:both;"></label>
<label id="lblCompanyAddress" class="center-position text-style" style="clear:both;"></label>
<label id="lblCompanyId" class="center-position text-style" style="clear:both;"></label>
</td>
</tr>
<tr>
<td class="border-top border-bottom">
<div style="padding:10px 0;">
<label id="lblStornoMessage" class="center-position text-style">@Translator.Translate("PAYOUT_CONFIRMATION")</label>
</div>
</td>
</tr>
<tr>
<td class="border-bottom">
<div style="height:25px;padding:10px 3px 0 3px;">
<label id="lblPayoutTicket" class="left-position text-style">@Translator.Translate("PAYOUT_TICKET")</label>
<label id="lblPinValue" class="right-position text-style">{{payoutTime | date: dateFormat }}</label>
</div>
</td>
</tr>
<tr>
<td>
<div style="padding:5px 3px;">
<label id="lblPinTicket" class="left-position text-style">@Translator.Translate("PIN")</label>
<label id="lblPinReturnValue" class="right-position text-style">{{ticketPin}}</label>
</div>
</td>
</tr>
<tr>
<td>
<div style="padding:5px 3px;">
<label id="lblPayinReturn" class="left-position text-style">@Translator.Translate("PAYOUT_AMOUNT")</label>
<label id="lblPayinReturnValue" class="right-position text-style">{{payoutAmount}}</label>
</div>
</td>
</tr>
<tr>
<td class="border-bottom">
<div style="padding:25px 3px 5px 3px;">
<label id="lblCreatedBy" class="left-post text-style">@Translator.Translate("CREATED_BY")</label>
<label id="lblCreatedByValue" class="right-position text-style">@User.Identity.Name</label>
</div>
</td>
</tr>
</table>
</div>
在控制器内保证数据“包”:
$scope.CheckTicket = function (ticketPin) {
if (ticketPin != null && ticketPin != "" && ticketPin != undefined) {
var promise = accountDataProviderService.checkTicketPayout(ticketPin);
$scope.checkPromise = promise;
promise.then(
function (response) {
$scope.showTicketPayout = true;
$scope.TicketsPayout = response;
},
function (err) {
$scope.showTicketPayout = false;
$scope.ticketNotFound = true;
$timeout(function ()
{
$scope.ticketNotFound = false;
}, ticketNotFound * 1000);
});
}
}
$scope.CloseMessage = function ()
{
$scope.ticketNotFound = false;
}
$scope.FinishTicketPayout = function (ticketPin)
{
accountDataProviderService.finishTicketPayOut(ticketPin)
.then(function (response) {
$scope.finishTicketPayOut = response;
localStorage.setItem("payoutTime", $scope.finishTicketPayOut.PayoutTime);
localStorage.setItem("payoutAmount", $scope.finishTicketPayOut.PayoutAmount);
});
}
$scope.ConfirmTicketPayOut = function (ticketPin, username) {
$scope.ticketPin = ticketPin;
localStorage.setItem("pin", ticketPin);
accountDataProviderService.confirmTicketPayOut(ticketPin, username)
.then(function (response) {
$scope.confirmTicketPayOut = response;
if ($scope.confirmTicketPayOut.Result == true) {
var newWindow = window.open("/print")
}
});
localStorage.clear();
}
angular.module("printModule").controller('printController', ['$scope', '$window', '$q', function ($scope, $window, $q) {
$scope.ticketPin = localStorage.getItem("pin");
$scope.payoutTime = localStorage.getItem("payoutTime");
$scope.payoutAmount = localStorage.getItem("payoutAmount");
var defer = $q.defer();
defer.resolve($scope.ticketPin);
defer.resolve($scope.payoutTime);
defer.resolve($scope.payoutAmount);
defer.promise.then(function () {
$window.print();
})
}]);
祝你今天愉快;) 我不明白你想要什么…但也许你应该做出承诺,等待它解决。请发布更多代码…@messerbill点击我想打开新窗口并填充数据并调用打印功能,但在我的情况下,它会打开新窗口并调用打印功能,然后填充数据,这样我就得到了空白页…您现在清楚了吗?为什么不调用其他站点的角度控制器中的打印功能?您还可以通过另一个站点的
$(document).ready()
函数来完成此操作。您可以通过target=“\u blank”
在另一个窗口中打开一个链接,这就是您要搜索的内容吗?我试图在另一个站点调用它,但我再次需要设置超时,因为它在打印功能后呈现部分视图,并且再次显示空白页面。请发布两个站点的代码或制作小提琴
angular.module("printModule").controller('printController', ['$scope', '$window', '$q', function ($scope, $window, $q) {
$scope.ticketPin = localStorage.getItem("pin");
$scope.payoutTime = localStorage.getItem("payoutTime");
$scope.payoutAmount = localStorage.getItem("payoutAmount");
var defer = $q.defer();
defer.resolve($scope.ticketPin);
defer.resolve($scope.payoutTime);
defer.resolve($scope.payoutAmount);
defer.promise.then(function () {
$window.print();
})
}]);