使用“ this”转换事件回调以承诺携带上下文

时间:2018-11-23 11:54:19

标签: javascript asynchronous javascript-events promise exif-js

我正在使用exif-js从Ionic 3应用程序的相机/照相馆图像中提取EXIF信息。我曾经捕获过onload事件并在回调中检索EXIF信息,现在我想通过使用Promise更改行为,但是我无法使其工作,因为检索EXIF信息的函数使用this,而我没有不了解如何使Promise上下文可以访问它。

这是我的旧代码:

public getImageEXIF(imagePath) {
    let imageR = new Image();
    imageR.onload = function () {
      exif.getData(imageR, function () {
        const allMetaData = exif.getAllTags(this);
      });
    };
    imageR.src = imagePath;
  }

违规行是const allMetaData = exif.getAllTags(this);,其中this包含富含EXIF数据的图像的副本。

这就是我将函数转换为异步方式的方法

 public waitImageLoad(imagePath): Promise<any> {
    return new Promise((resolve) => {
      let photo = new Image();
      photo.onload = () => resolve(photo)
      photo.src = imagePath;
    });
  }

public getImageEXIFAsync(imagePath) {
    this.waitImageLoad(imagePath).then((photo) => {
      exif.getData(photo, () => {
        // Here `this` points to the class to which `getImageEXIFAsync` belongs to
        const allMetaData = exif.getAllTags(this);
        console.log(lat, long);

        if (lat && long) {
          return { latitude: lat, longitude: long }
        } else {
          return null
        }
      })
    })
  }

我尝试了几件事,包括使用不同的参数(resolvegetData ...)将this传递给photo,但没有成功。

如何携带getData context over to the promise so that getImageEXIFAsync`返回EXIF数据?

1 个答案:

答案 0 :(得分:0)

您要寻找的是call, apply and bind

You can find some explanation here

您想要做的是:

exif.getData([此处输入您的代码])。call(exif)