检测 IMG 元件何时加载角度为2 +

我正在使用 Angular 2,我需要检测一个图像是否已经加载到一个图像标记。

有这样的活动吗?

就像这样:

<img [src]="imagesource" [loaded]="dosomething()">
65273 次浏览
<img [src]="imagesource" (load)="dosomething()">

Extending the first answer to examine the image that just loaded.

    <img [src]="imagesource" (load)="onImageLoad($event)">


onImageLoad(evt) {
if (evt && evt.target) {
const width = evt.target.naturalWidth;
const height = evt.target.naturalHeight;
const portrait = height > width ? true : false;
console.log(width, height, 'portrait: ', portrait);
}
}

However, I saw that chrome sends the event twice, with different sizes! I was able to detect the correct size from the event where evt.scrElement.x and y was zero. But this might not always be the case and I'm not sure why there are two events?

    onImageLoad(evt) {
if (evt && evt.target) {
const x = evt.srcElement.x;
const y = evt.srcElement.y;
if ((x === 0 ) && (y === 0)) {
const width = evt.srcElement.width;
const height = evt.srcElement.height;
portrait = height > width ? true : false;
console.log('Loaded: ', width, height, 'portrait: ', portrait);
}
}
}