Use json pretty print in angularjs

Question

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\',n         


        

Answer 1

Angular already has the json filter built-in:

  {{data | json}}

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:

  
    {{data | prettyJSON}}
  

ES6 version from @TeChn4K:

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