Skip to content

Instantly share code, notes, and snippets.

@whisher
Created September 24, 2018 21:11
Show Gist options
  • Save whisher/3694a251ddc0a09a0de155279a78475a to your computer and use it in GitHub Desktop.
Save whisher/3694a251ddc0a09a0de155279a78475a to your computer and use it in GitHub Desktop.
import { Component, OnInit, ContentChild, ElementRef, Renderer2 } from '@angular/core';
@Component({
selector: 'app-image-loader',
template: `<h1 *ngIf="isLoaded">LOADING</h1>
<ng-content></ng-content>`,
styleUrls: ['./image-loader.component.css']
})
export class ImageLoaderComponent implements OnInit {
isLoaded = true;
@ContentChild('my') my: ElementRef;
constructor(private renderer: Renderer2) { }
ngOnInit() {
console.log(this.my);
this.renderer.listen(this.my.nativeElement, 'load', (event) => {
this.isLoaded = false;
console.log(event);
})
}
}
<app-image-loader>
<img #my src="https://picsum.photos/1024/683?image=1074" alt="pippo">
</app-image-loader>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment