Angular 7 linking with iframe

Question

I'm trying to bind a link (project.projectUrl) inside an iframe but cannot seem to get it to work. I'm trying to bind the projectUrl from my JSON file to the iframe src so I can dynamically display iframes from within a modal if that is possible. Please see my code in the comment below.

Answer 1

You need to sanitize the src. https://angular.io/api/platform-browser/DomSanitizer#bypassSecurityTrustResourceUrl.

One of the ways to do it, in your component constructor:

constructor(sanitizer: DomSanitizer, ....)

and then

<iframe [src]="sanitizer.bypassSecurityTrustResourceUrl(project.projectUrl)" height="600" width="1000"></iframe>