首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >在本机应用程序上显示图像

在本机应用程序上显示图像
EN

Stack Overflow用户
提问于 2019-08-20 16:16:02
回答 1查看 40关注 0票数 1

我用Angular做了一个移动应用程序,我试着用同样的方法在原生应用程序上显示图像,但现在我必须按下一个按钮才能显示这张图像。

代码语言:javascript
运行
复制
currentImageb: any;

public takePhoto() {
    console.log('Camera Photo Click');
    const options: CameraOptions = {
      quality: 100,
      destinationType: this.camera.DestinationType.DATA_URL,
      encodingType: this.camera.EncodingType.JPEG,
      mediaType: this.camera.MediaType.PICTURE,
      saveToPhotoAlbum: true,
    }
    this.camera.getPicture(options).then((imageData) => {

    let base64Image = 'data:image/jpeg;base64,' + imageData;

    this.currentImageb = base64Image;

    }, (err) => {
    // Handle error
    });
  }

//Click on Shoh Img Button
  showImgB() {
    (document.getElementById('b') as HTMLImageElement).src = this.currentImageb;
  }
代码语言:javascript
运行
复制
// I would like to show my image in the <img> without a button
<ion-button (click)="showImgB()">IMAGE id b</ion-button>
<img src="" id="b">

我还想在我的应用程序页面上展示我拍摄的每张照片,而不仅仅是最新的照片。谢谢

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-08-20 16:20:28

例如,您不应该使用getElementById来操作DOM。操纵DOM应该是Angular的最后手段。通常情况下,angular提供了一些工具来执行您想要的操作,在这种情况下,只需对变量应用src即可,例如:

代码语言:javascript
运行
复制
<img [src]="currentImageb">
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/57569366

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档