title: Convert &lt;p&gt; to <p> and use to format html
body: <p>A web service is returning data to my app in this format (unfortunately I have no control over the server output):</p>
  
  <pre><code>&amp;lt;p&amp;gt; This is a paragraph &amp;lt;/p&amp;gt;
  </code></pre>
  
  <p>When trying to display this data using <code>innerHtml</code> the result is as follows</p>
  
  <pre><code>&lt;p&gt;This is a paragraph&lt;/p&gt;
  </code></pre>
  
  <p>How do I 'pass on' the formatting to the browser so it interprets the paragraph tag and displays it? </p>
  
  <p>Stackoverflow interpreting the <code>&lt;p&gt;</code>:</p>
  
  <p>This is a paragraph</p>
  
  <hr />
  
  <p>A plunker to demonstrate <a href="https://plnkr.co/edit/BbAVrT8F1rJGZnJmov1g?p=preview" rel="nofollow noreferrer">https://plnkr.co/edit/BbAVrT8F1rJGZnJmov1g?p=preview</a>, code also listed below.</p>
  
  <pre><code>@Component({
    selector: 'my-app',
    template: `
      &lt;div [innerHtml] = "name"&gt;
      &lt;/div&gt;
    `,
  })
  export class App {
    name:string;
    constructor() {
      this.name = `&amp;lt;p&amp;gt;This is a paragraph&amp;lt;/p&amp;gt;`
    }
  }
  </code></pre>
  
  <p>I have tried <code>&lt;script&gt;decodeURI({{name}})&lt;/script&gt;</code> but that simply returns <code>&lt;"</code>.</p>
  
  <p>I have also looked at other stack questions and tried a pipe to bypass the security of the html, which didn't work. Reading the Angular2 docs it sounds like that's not it's purpose. I also tried the style override, it failed as this is not a style, it's pure html:</p>
  
  <pre><code>@Pipe({ name: 'safeHtml'})
  export class SafeHtmlPipe implements PipeTransform  {
    constructor(private sanitized: DomSanitizer) {}
    transform(value: string) {
      return this.sanitized.bypassSecurityTrustHtml(value);
    }
  }
  </code></pre>