相关疑难解决方法(0)

我想把图像放在画布上.最初我用图像作为背景.但每当我将画布转换为图像时,背景图像都不会被复制.因此我试图在画布上绘制图像.我从设备图库中选择图像.将图像URL存储为字符串并传递给下一个组件.我检查过,能够得到价值.请看下面的代码,让我知道我做错了什么.

1. HTML

<canvas no-bounce id="canvas"
    (touchstart)='handleStart($event)' (touchmove)='handleMove($event)' (touchend)='handleEnd($event)' (click)="removeSelectedTxt()"
    [ngStyle]="{
    'width': '98%',
    'height': '65%'}" #canvas ></canvas>

2. ts文件

@ViewChild('canvas') public canvas: ElementRef;

ionViewDidLoad() {
   console.log('ionViewDidLoad ImageHomePage');
    this.canvasElement = this.canvas.nativeElement;
    this.ctx = this.canvasElement.getContext('2d');
    let image = this.renderer.createElement('img');
    image.src = this.selectedImage;
    this.ctx.drawImage(image,10, 10, this.canvasElement.width, 
    this.canvasElement.height);
}

我用另一种方式也......

方法2-

ionViewDidLoad() {
    // this.selectedImage = this.route.snapshot.params['id'];
    console.log('ionViewDidLoad ImageHomePage');
    let canvasID= document.getElementById("canvas") as HTMLCanvasElement; 
    let canvasContext = canvasID.getContext("2d");
    this.canvasElement = this.canvas.nativeElement;
    this.ctx = this.canvasElement.getContext('2d');
    let image = new Image() as HTMLImageElement;
    image.onload = function() …