@ViewChild('canvas') canvas: ElementRef;

mergeImages() {
  var canvas: HTMLCanvasElement = this.canvas.nativeElement;
  var context = canvas.getContext('2d');

  let img1 = new Image();
  let img2 = new Image();

  img1.onload = function() {
    canvas.width = img1.width;
    canvas.height = img1.height;
    img2.src = 'imgfile2.png';
  };
  img2.onload = function() {
    context.globalAlpha = 1.0;
    context.drawImage(img1, 0, 0);
    context.globalAlpha = 0.5; //Remove if pngs have alpha
    context.drawImage(img2, 0, 0);
  };

  img1.src = 'imgfile1.png';
}