title: Render minified HTML text from JSON and bind the model values to the HTML in Angular 5
body: <pre><code>export class SetUpAppPopupComponent {
     constructor(public sanitizer: DomSanitizer) { }
  
     ngOnInit() {
        this.IFrameUrl = this.sanitizer.bypassSecurityTrustResourceUrl("https://angular.io/");
     }
  
  
    getAppHtml() {
      var MinifiedHtml = "&lt;div&gt; &lt;iframe class=\"col-md-12\" style=\"display:block;height:100%\" [src]=\"IFrameUrl\" frameborder=\"0\" allowFullScreen=\"true\"&gt;&lt;/iframe&gt; &lt;/div&gt;"
      return this.sanitizer.bypassSecurityTrustHtml(MinifiedHtml);
     }
  
  }
  </code></pre>
  
  <p>.html</p>
  
  <pre><code>&lt;div [innerHtml]="getAppHtml()"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>If you look at the above example HTML is getting rendered but the JSON model  object "IFrameUrl" is not getting binded to IFrame tag. Is there a way to achieve it?</p>