将JSON对象转换为漂亮的JSON的Angular 2管道 [英] Angular 2 pipe that transforms JSON object to pretty-printed JSON

问题描述

尝试编写一个Angular 2管道，它将接收一个JSON对象字符串，并将其返回给用户显示。

例如，将采取这样的：

id：1，
number：K3483483344，
状态：CA，
active：true
}

HTML：

所以在我看来，我可以有这样的： p>

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

解决方案

我想添加更简单的方法使用内置的 json pipe：

 < pre> ; {{data | 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:

So in my view I could have something like:

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

解决方案

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.

这篇关于将JSON对象转换为漂亮的JSON的Angular 2管道的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！