在cordova相机插件的success方法中调用angluar2方法

Posted 2023-04-17

【中文标题】在cordova相机插件的success方法中调用angluar2方法

【英文标题】：call angluar2 method within the success method of the cordova camera plugin

【发布时间】：2018-01-22 06:55:59

【问题描述】：

我已经成功地在我的 angular2 项目中集成了一个 cordova 插件。 我调用了成功调用本机相机的“takePicture”方法。

public takePicture() 
    const srcType = navigator.camera.PictureSourceType.CAMERA;
    const options = this.setOptions(srcType);
    navigator.camera.getPicture(this.onSuccess, this.onFail,options);
  

  public onSuccess(imageData) 
    this.capture('data:image/jpeg;base64,' + imageData); <-- this doesn't work here I guess

  

  public onFail(message) 
    alert('Failed because: ' + message);
    console.log(message);
  
.....

问题是当我拍照并调用 onSuccess 函数时，当我调用 this.capture(....) 时它会失败，并出现以下错误：

core.es5.js:1084 ERROR TypeError: Cannot read property 'capture' of 空

这意味着 Angular 不知道 this.capture(..) 方法。 有谁知道如何解决这个问题？

【问题讨论】：

无法读取 null 的属性“捕获”。我认为您需要先检查是否有任何数据弹出

我检查 imageData 是否已填充。

如果我调试我发现这是 null 在方法中。在编译时我没有错误

【参考方案1】：

在将实例方法作为回调传递时，您会丢失对象上下文，因此 this 的计算结果为 null。

您可以通过将方法调用包装在一个函数中来轻松修复它：

navigator.camera.getPicture(
    (data) => this.onSuccess(data),
    (message) => this.onFail(message),
    options
);