Use json pretty print in angularjs

angularjs

Solution

Angular already has the `json` filter built-in:

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

The `json` after the pipe `|` is an Angular Filter. You can make your own custom filter if you like:

app.filter('prettyJSON', function () {
    function prettyPrintJson(json) {
      return JSON ? JSON.stringify(json, null, '  ') : 'your browser doesnt support JSON so cant pretty print';
    }
    return prettyPrintJson;
});

To use your custom `prettyJSON` filter:

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

ES6 version from @TeChn4K:

app.filter("prettyJSON", () => json => JSON.stringify(json, null, " "))

Problem

How can I use this json pretty print [ http://jsfiddle.net/KJQ9K/ ] with angularJS? Lets assume myJsonValue is ``` {a:1, 'b':'foo', c:[false,'false',null, 'null', {d:{e:1.3e5,f:'1.3e5'}}]} ``` I want to be able to use below to render pre (as shown in example)

Original source

Related problems