Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

415
Vistas
Obtener la altura y el ancho de una imagen en Angular usando TypeScript

Estoy tratando de obtener el ancho y el alto de una imagen usando su URL src.
Este código genera "undefinedxundefined" en la consola.
Esto es lo que tengo ahora:

 getImageSize(image: string) { let width; let height; let img = new Image(); img.src = image; img.onload = function (event) { let targetImg = event.currentTarget as HTMLImageElement; width = targetImg.width; height = targetImg.height } return width + "x" + height;

}

Estoy usando la versión 12.2.11 de Angular.
¡¡Gracias!!

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

Necesita buscar en Observable y suscripciones:

 getImageSize(url: string): Observable<any> { return new Observable(observer => { var image = new Image(); image.src = url; image.onload = (e: any) => { var height = e.path[0].height; var width = e.path[0].width; observer.next(width + 'x' + height); observer.complete(); }; }); }

Luego puede suscribirse a ese observable y obtener la respuesta de él:

 this.getImageSize('your image url').subscribe(response => { console.log(response); });

y eso devolverá el width + 'x' + height .

about 4 years ago · Juan Pablo Isaza Denunciar

0

Para obtener el rect de cualquier elemento HTML, use:

 const el = document.getElementById('dd'); const rect = el.getBoundingClientRect(); const height = rect.height; const width = rect.width;
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda