Imágenes que no se cargan en Angular 2

Archivo HTML:

Aquí el https://stackoverflow.com/questions/45920722/images-not-loading-in-angular-2/New-Google-Logo.png está en la misma carpeta que en el archivo html. Pero después de ng, la página html se carga con otros detalles, pero no con la imagen. Intentado dando directamente un enlace para una imagen (como www.google.com/images/x.png), funciona, pero el archivo local no se está cargando.

Árbol de carpetas:

 src -app -logincomponent - logincomponent.html - logincomponent.css - https://stackoverflow.com/questions/45920722/images-not-loading-in-angular-2/New-Google-Logo.png - logincomponent.ts -homecomponent - homecomponent.html - homecomponent.css - homecomponent.ts 

Aquí el New-Google.png se refiere dentro de logincomponent.html como se indica anteriormente.

Prueba 2:

 src -app -logincomponent - logincomponent.html - logincomponent.css - Images - https://stackoverflow.com/questions/45920722/images-not-loading-in-angular-2/New-Google-Logo.png - logincomponent.ts 

Y referido en el html como:

 

Ambos no funcionaron.

Si está usando angular-cli, todos sus activos estáticos deben mantenerse en la carpeta de activos. Entonces deberías dar camino como

  

Cuando sirve el proyecto, todos los activos estáticos deben ser enviados al cliente para mostrarlo en el cliente. Angular cli comstack y agrupa todo el proyecto en archivos js. Para servir a tus activos estáticos puedes seguir dos formas

  • ponga todos sus activos estáticos en la carpeta de activos que angular-cli sirve con .angular-cli.json predeterminado
  • o necesita ingresar la carpeta de activos estáticos en el archivo .angular-cli.json en una matriz denominada como activos ya que mi carpeta de imágenes está en la carpeta estática y la carpeta estática está en el mismo nivel jerárquico de la carpeta de activos

     "assets": [ "assets", "static/images" ] 

Si crea un proyecto usando CLI, tendrá una carpeta de activos, solo cree una carpeta de imágenes dentro y pegue todas las imágenes dentro de ella de tipo .png y luego dé
reference src = “asset / images / AnyImage.png” dentro de su html cargará las imágenes. En realidad pegaste tus imágenes dentro de la carpeta loginComponent. Intenta esto funcionará.