在angularjs中使用json pretty print

本文介绍了在angularjs中使用json pretty print的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

如何将我的json漂亮打印[ http://jsfiddle.net/KJQ9K/]与angularJS一起使用?

How can I use this json pretty print [ http://jsfiddle.net/KJQ9K/ ] with angularJS?

让我们假设myJsonValue是

Lets assume myJsonValue is

{a:1, 'b':'foo', c:[false,'false',null, 'null', {d:{e:1.3e5,f:'1.3e5'}}]}

我希望能够在下面使用它来渲染pre(如示例所示)

I want to be able to use below to render pre (as shown in example)

推荐答案

Angular已具有json过滤器内置:

Angular already has the json filter built-in:

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

管道|之后的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;
});

要使用自定义的prettyJSON过滤器，请执行以下操作:

To use your custom prettyJSON filter:

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

@ TeChn4K的ES6版本:

ES6 version from @TeChn4K:

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

这篇关于在angularjs中使用json pretty print的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！