javascriptjsonfilterangularpipe

Angular 2 pipe that transforms JSON object to pretty-printed JSON

Trying to write an Angular 2 pipe that will take a JSON object string and return it pretty-printed/formatted to display to the user.

For example, it would take this:

{ "id": 1, "number": "K3483483344", "state": "CA", "active": true }

And return something that looks like this when displayed in HTML:

enter image description here

So in my view I could have something like: 

<td> {{ record.jsonData | prettyprint }} </td>
Solution

  • I would like to add an even simpler way to do this, using the built-in json pipe:

    <pre>{{data | json}}</pre>

    This way, the formatting is preserved.