CODEWITHSUNDEEP
angularsvg
Diogo Santos
Diogo Santos

Reputation: 830

Call contentdocument of object OnInit

I have the following in my Angular component:

<object data="../../assets/drawing.svg" type="image/svg+xml"
id="svgSF" width="100%" height="100%"></object>

However, when I do the following snippet:

ngOnInit(): void {
    var svgSF:any=document.getElementById('svgSF');
    console.log(svgSF.contentDocument);
  }

It returns me an empty document:

<html> <body> </body> </html>

If I do this in my Chrome's debugger it returns me the svg document. Does the object is still not initialized in my OnInit function?

Upvotes: 1

Views: 189

Answers (2)

C. Bd
C. Bd

Reputation: 73

It is necessary to use onload method on the svg element, like this: 

export class AppComponent implements AfterViewInit {

  ngAfterViewInit(){
    console.log("-- AfterViewInit --");
    var svgSF:any=document.getElementById('svgSF');
    svgSF.onload = () => {
        console.log(svgSF.contentDocument);
    } 
  }
}

Upvotes: 0

AlexanderFSP
AlexanderFSP

Reputation: 662

You need to move this logic into ngAfterViewInit lifecycle hook.

Upvotes: 1

Related Questions