CODEWITHSUNDEEP
canvasangular
Lucifer
Lucifer

Reputation: 1079

Canvas Usage in Angular2

I am adding the canvas dynamically and I have to draw something on that canvas. How to access the canvas 

<canvas id=\"myCanvas\" class='myCanvas' #myCanvas width=\"100\" height=\"100\">

I am adding this dynamically using innerHTML on the required div

    @Component({
        selector: 'my-view',
        template: `
           <div [innerHTML]="{{str}}"></div>
    `

        })

        export class countryOverviewComponent implements ngOnInit(
               private str="";
               ngOnInit() {
                 this.str="<canvas id=\"myCanvas\" class='myCanvas' #myCanvas width=\"100\" height=\"100\">";
                 this.getCanvas();
           }
           getCanvas(){
              //I have to get the canvas here.
         }
        )

Upvotes: 0

Views: 624

Answers (1)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657158

When adding Angular2 specific syntax using [innerHTML], Angular2 just passes the string as-is and doesn't process it in any way.

If you want to add it dynamically, wrap it in a component and use ViewContainerRef.createComponent() do add the component dynamically.

For an example see Angular 2 dynamic tabs with user-click chosen components

Upvotes: 1

Related Questions