Question

我正在使用我的角度应用程序中的图像的自定义指令。在指令中，我想添加占位符图像，直到图像加载并且占位符图像必须应用“无图像”类。这就是我所做的：

loadImage(image: string) {
    let defaultImage = this._getLocalResource(this._NO_IMAGE);
    this.currentElement.className = 'no-image';
    this.currentElement.src = defaultImage;
    const img = new Image();
    if (image) {
        img.src = image;
    } else {
        img.src = defaultImage;
    }
    img.onload = () => {
        this.currentElement.classList.remove('no-image');
        this.currentElement.src = img.src;
    };
    img.onerror = err => {
        this.currentElement.class = 'no-image';
        this.currentElement.src = defaultImage;
    };
}

我的问题是当图像加载时（在onload函数内）删除类“无图像”需要一些时间，并且加载的图像使用“无图像”类渲染几分之一秒。这会导致令人不快的用户体验。

有没有办法在成功删除类后将加载的图像分配给currentElement.src，或者是否有任何异步方式删除该类？

Answer 1

你可以尝试延迟 this.currentElement.src = img.src; 排队settimeout

如何异步删除类函数？

1 个答案: