How to display xml content with tags in Angular framework, allowing to collapse tags?

Question

I have decoded a base64-encoded string using atob() function:

this.rawMessage = decodeURIComponent(atob(str));

I'm able to create an object url from that string and display the content in a new browser tab:

let blob = new Blob([this.rawMessage], {type:"text/xml"});
window.open(URL.createObjectURL(blob));

in the new tab i can see the xml content in this format:

I'd like to have the same behaviour (to allow the user to collapse the xml tags) without opening a new tab in the browser. But just showing the xml content, with all the tags inside the html document. Is there any way to do it?

I have tried by using the iframe element:

app.component.html

<p>My xml:</p>
<iframe [src]="url"></iframe>

app.component.ts

url;    
constructor (private sanitizer: DomSanitizer){
    let blob = new Blob([this.rawMessage], {type:"text/xml"});
    this.url = this.sanitizer.bypassSecurityTrustResourceUrl(URL.createObjectURL(blob))
}

But I'm getting the following Error: Required a safe ResourceURL, got a URL.