ngx-cu v0.0.4

@authors

Alan Asmis.

Lautaro Zapata.

Modules:

CuImageModule

• CuImageLoaderComponent
• CuImageService

Core Utils Image Module

Import the CuImageModule.

import {CuImageModule} from 'ngx-cu';

@NgModule({ 
  imports: [ CuImageModule ]
})
export class AppModule { }

Components:

CuImageLoaderComponent

1. add the '' selector to the html where you wanna use the component.

   <cu-image-loader src="https://www.hdwallpapers.in/walls/the_legend_of_zelda_breath_of_the_wild_4k-wide.jpg">
       <div cu-loader>
           <h5>loading ...</h5>
       </div>
       <div cu-error>
           oh oh, check  the error.
       </div>
   </cu-image-loader>

2. Pass the url to the “src” attribute:
   • if you pass by html use this sintax
     src = "./../assets/image.svg"
   • if you will use atributes use this sintaxs: [src] = " './../assets/image.svg' " [src] = "srcImage"

3. modify the style of the image in the host component:

   :host ::ng-deep .cu-image {
       max-width: 20vw;
   }

   or you can do (but is recomended that you use the last method)

   :host /deep/ .cu-image {
       max-width: 20vw;
   }

   If you want more info about "Shadow DOM" go to this blog.

Services

CuImageService

• getImage(src : string) : Promise<HTMLImageElement>