title: Angular 2 prettify JSON pipe filter
body: <p>Strange I'm trying to print my JSON in pretty formatted way however my JSON keeps returning with <code>\</code> and not being printed pretty.</p>
  
  <p>I have this solution which works on plnkr but not on my actual application. The image below is the printed JSON which is similar to what I have on plnkr.</p>
  
  <p>Can anyone shed a light why this is happening?</p>
  
  <p>Plnkr sample:
  <a href="https://plnkr.co/edit/ZqOXS30XPTu9ponWFdgZ?p=preview" rel="nofollow">https://plnkr.co/edit/ZqOXS30XPTu9ponWFdgZ?p=preview</a></p>
  
  <p>Code pipe:</p>
  
  <pre><code>    @Pipe({
    name: 'prettyprint'
  })
  export class PrettyPrintPipe {
     transform(val) {
      if(typeof(val) == "undefined" || typeof(val) == null) return ''; //check value before process it.
      return JSON.stringify(val, null, 2)
        .replace(/ /g, '&amp;nbsp;')
        .replace(/\\n/g, '&amp;lt;br&amp;gt;');
    }
  }
  </code></pre>
  
  <p>JS Object, I need to <code>JSON.stingify</code> the two objects so I can <code>concat</code> or add the <code>childObj</code> inside the parent.</p>
  
  <p><a href="https://i.stack.imgur.com/0Zp8p.png" rel="nofollow"><img src="https://i.stack.imgur.com/0Zp8p.png" alt="enter image description here"></a></p>
  
  <pre><code>var parentJSONObj = JSON.stringify(object)
  var childObj = JSON.stringify(object) // in a diferent schema 
  this.output = parentJSONObj.replace(replaceObj, childObj) // and need to replace a property inside childObj
  </code></pre>
  
  <p>so <code>this.output</code> is the final JSON structure which <strong><em>I think</em></strong> is already a JSON string, adding the pipe filter gives adds slashes. When I try <code>JSON.parse(this.output)</code> it gives me an error of <code>Unexpected token o in JSON at position 214</code></p>
  
  <p><a href="https://i.stack.imgur.com/bkJ3V.jpg" rel="nofollow"><img src="https://i.stack.imgur.com/bkJ3V.jpg" alt="enter image description here"></a></p>