Javascript 在div结束时停止打印机

我在POS网站工作，当我打印销售数据收据时，我想用id在div末尾停止打印机，但没有发生，打印机继续打印。我使用了css属性“page break after:always”，但它不起作用。我的css类看起来像

    @media print {
     .paper-size {
       float: none !important;
       display: block !important;
       width: 76mm !important;
       page-break-after: always !important;
    }}

这是我的HTML部分

   <div id="print-div">
            <div class="paper-size">
                <div class="d-none d-print-block">
                    <div class="row justify-content-center ">
                        <div class="col-xs-10" style=" height: 25px;vertical-align: top;">
                            <h3>Hamed Medicose & Cosmetics</h3>
                        </div>
                    </div>
                    <div class="row" style=" height: 50px;vertical-align: top;">
                        <div class="col-md-12 text-center">
                            <p>Address</p>
                        </div>
                    </div>
                    <div class="row justify-content-center" style=" height: 20px;vertical-align: top;">
                        <div class="col-xs-6">
                            <p>Mobile : </p>
                        </div>
                    </div>
                    <div class="row justify-content-center" style=" height: 15px;vertical-align: top;">
                        <div class="col-xs-4">
                            <h5>Drug Lic # :  </h5>
                        </div>
                        <div class="col-xs-4  pl-20">
                            <h5>User : {{userName}} </h5>
                        </div>
                    </div>
                    <div class="row justify-content-center pt-20">
                        <div class="col-xs-4">
                            <p>date</p>
                        </div>
                    </div>
                    <div class="row pl-20">
                        <div class="col-xs-4">
                            <p>Invoice No : {{invoiceNo}}</p>
                        </div>
                        <div class="col-xs-4 pl-20">
                            <p>Mr/Ms : {{patient}}</p>
                        </div>
                    </div>
                </div>
                <div class="paper-size ">
                    <div class="row d-print-none">
                        <div class="col-md-12">

                            <mat-table #table [dataSource]="myDataSource" *ngIf="saleItemList.length != 0">

                                <ng-container matColumnDef="id">
                                    <mat-header-cell *matHeaderCellDef style="width : 2%" class="d-print-none">#</mat-header-cell>
                                    <mat-cell *matCellDef="let element; let i=index" style="width : 2%" class="d-print-none"> {{i+1}}</mat-cell>
                                </ng-container>

                                <ng-container matColumnDef="name">
                                    <mat-header-cell *matHeaderCellDef>
                                        <h4>Item Name</h4>
                                    </mat-header-cell>
                                    <mat-cell *matCellDef="let element">
                                        <p>{{element.name + ' ' + element.strength }}</p>
                                    </mat-cell>
                                </ng-container>
                                <ng-container matColumnDef="pack">
                                    <mat-header-cell *matHeaderCellDef>
                                        <h4>Pack</h4>
                                    </mat-header-cell>
                                    <mat-cell *matCellDef="let element">
                                        <p>{{element.pack}}</p>
                                    </mat-cell>
                                </ng-container>
                                <ng-container matColumnDef="qty">
                                    <mat-header-cell *matHeaderCellDef>
                                        <h4>Qty</h4>
                                    </mat-header-cell>
                                    <mat-cell *matCellDef="let element">
                                        <p>{{element.total_qty}}</p>
                                    </mat-cell>
                                </ng-container>
                                <ng-container matColumnDef="price">
                                    <mat-header-cell *matHeaderCellDef>
                                        <h4>Price</h4>
                                    </mat-header-cell>
                                    <mat-cell *matCellDef="let element">
                                        <p>{{element.sale_price}}</p>
                                    </mat-cell>
                                </ng-container>
                                <ng-container matColumnDef="total">
                                    <mat-header-cell *matHeaderCellDef>
                                        <h4>Total</h4>
                                    </mat-header-cell>
                                    <mat-cell *matCellDef="let element">
                                        <p>{{element.total}}</p>
                                    </mat-cell>
                                </ng-container>
                                <ng-container matColumnDef="action">
                                    <mat-header-cell *matHeaderCellDef class="d-print-none">Action</mat-header-cell>
                                    <mat-cell *matCellDef="let element;let i=index" class="d-print-none">
                                        <button mat-icon-button (click)="removeFromList(i, element.total)">
                                            <mat-icon>delete</mat-icon>
                                        </button>
                                    </mat-cell>
                                </ng-container>

                                <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
                                <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
                            </mat-table>
                        </div>
                    </div>
                    <table class="table d-print-table d-none d-print-block table-border full-width">
                        <tr>
                            <td>Item Name</td>
                            <td>Pack</td>
                            <td>Qty</td>
                            <td>Price</td>
                            <td>Total</td>
                        </tr>
                        <tr *ngFor="let o of saleItemList">
                            <td>{{o.name + ' ' + o.strength}}</td>
                            <td>{{o.pack}}</td>
                            <td>{{o.total_qty}}</td>
                            <td>{{o.sale_price}}</td>
                            <td>{{o.total}}</td>
                        </tr>
                    </table>
                </div>

                <div class="d-none d-print-block">
                    <div class="row justify-content-end ver-space">
                        <div class="col-5">
                            <p>Total : {{saleTotal}}</p>
                        </div>
                    </div>
                    <div class="row justify-content-end ver-space">
                        <div class="col-5">
                            <p>Discount : {{discount}}</p>
                        </div>
                    </div>
                    <div class="row justify-content-end ver-space ">
                        <div class="col-5">
                            <p>Pay : {{grandTotal}}</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>

哈米德化妆品公司
地址

流动电话：

药物：
用户：{{userName}}
日期

发票编号：{{invoiceNo}

先生/小姐：{{病人}

#
{{i+1}}
项目名称
{{element.name+''+element.strength}

包裹
{{element.pack}

数量
{{元素.总数量}

价格
{{element.sale_price}

全部的
{{element.total}

行动
删除
项目名称
包裹
数量
价格
全部的
{{o.name+''+o.strength}
{{o.pack}
{{o.总数量}
{{o.销售价格}
{{o.total}}
总计：{{saleTotal}}

折扣：{{折扣}

支付：{{grandTotal}

所以我想做的是，当打印机打印最后一个div时，带有“发票号”和“患者姓名”的打印机应该在该点停止，但不会发生。打印完有用的数据后，打印机打印出空白页，所以我通过关闭它来停止打印

和javascript部分

   static print(content:any) {
    let head:any = document.getElementsByTagName('head')[0];
    let htmlContent = '<html><head>'+head.innerHTML+'</head><body onload="window.print();window.close()">'+content.innerHTML+'</body></html>';

    let popupWin = window.open('', '_blank', 'top=0,left=0,height=100%,width=auto');
    popupWin.document.open();
    popupWin.document.write(htmlContent);
    popupWin.document.close();
}

静态打印（内容：任意）{
让head:any=document.getElementsByTagName（'head'）[0]；
让htmlContent=''+head.innerHTML+''+content.innerHTML+''；
让popupWin=window.open（“”，"u blank’，“top=0，left=0，height=100%，width=auto”）；
popupWin.document.open（）；
popupWin.document.write（htmlContent）；
popupWin.document.close（）；
}