Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

312
Views
Cómo ocultar el contenido de fondo de window.open mientras se imprime en Angular

Tengo la aplicación Angular 12 en ejecución y estoy integrando el comportamiento para imprimir el informe. Puedo lograr la impresión al hacer clic en el botón que abre una nueva ventana, pero no puedo averiguar cómo lograr las siguientes cosas:

  1. Elimine el contenido de fondo en window.open para que la ventana de impresión se vea como una ventana de impresión normal que vemos al presionar Win+P en nuestro navegador. ingrese la descripción de la imagen aquí
  2. Centre la ventana emergente de impresión en la pantalla.
  3. No se pueden mostrar imágenes en la ventana de impresión. Si agrego cualquier etiqueta img en html como: <img src="assets/images/galaxy.png" alt=""> , la imagen no se muestra en la ventana de impresión. Si comento window.print() y solo uso window.open(), la imagen se muestra

imprimir.servicio.ts

 showDialog() { const factory = this.componentFactoryResolver.resolveComponentFactory(PrintReportComponent); const dialogComponentRef = factory.create(this.injector); dialogComponentRef.instance.title = 'Report'; dialogComponentRef.changeDetectorRef.detectChanges(); //fetch the root DOM element of ModalComponent const domElement = (dialogComponentRef.hostView as EmbeddedViewRef<any>) .rootNodes[0] as HTMLElement; const WindowPrt = window.open( '', '', 'top=0,left=0,height=100%,width=auto' ); WindowPrt.document.head.innerHTML = document.head.innerHTML; WindowPrt.document.body.innerHTML = domElement.outerHTML; WindowPrt.document.close(); WindowPrt.focus(); WindowPrt.print(); WindowPrt.close(); }

enlace de stackblitz : https://stackblitz.com/edit/angular-ivy-c1ewya?file=src%2Fapp%2Fprint.service.ts

about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

En esta parte :

 const WindowPrt = window.open( '', '', 'top=0,left=0,height=100%,width=auto' );

Tienes que eliminar '', ''. cambiar a :

 const WindowPrt = window.open( 'top=0,left=0,height=100%,width=auto' );
about 4 years ago · Juan Pablo Isaza Report

0

Deberías cambiar tu estrategia en absoluto. Si haces esto, funcionará. Por favor, intente este ejemplo uno:

link-stackblitz

Agregué una imagen ficticia y se muestra.

Buena suerte ;)

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!