Agregar elemento canvas a div - Angular 4 - html5, angular, lienzo

Tengo una aplicación angular 4 En uno de mis escenarios, los usuarios cargan archivos tiff en el servidor. Para mostrar la vista previa del archivo en el navegador, estoy usando Tiff.js biblioteca para generar un elemento de lienzo html. Parece que todo funciona bien para el siguiente fragmento de código. Estoy obteniendo el objeto canvas con éxito.

this.image = myReader.result;
var tiff = new Tiff({buffer: loadEvent.target.result});
var canvas = tiff.toCanvas();
//document.body.append(canvas);
this.tiffCanvas = canvas;

Pero tengo dificultades para mostrar mi elemento canvas en la página. Aquí está mi html:

<div id="tiffCanvasContainer" [innerHtml]="tiffCanvas"></div>

Simplemente imprime [object HTMLCanvasElement] a la página. ¿Cómo puedo mostrar el lienzo generado en mi página con éxito?

Respuestas

// your component.ts
import { ViewChild, ElementRef, OnInit ... } from "@angular/core";

@Component({...})
export class Component implements OnInit {
@ViewChild("tiffCanvasContainer") public tiffCanvasContainer: ElementRef;
public tiffCanvas: HTMLCanvasElement; // your canvas element

public ngOnInit() {
this.tiffCanvasContainer.nativeElement.appendChild(this.tiffCanvas);
}
}


<div #tiffCanvasContainer>...</div> // your template