AngularJS格式JSON字符串输出
ame*_*ire 90 javascript string formatting json angularjs
我有一个AngularJS应用程序,它从输入中收集数据,使用模型将模型转换为字符串,JSON.stringify()并允许用户编辑此模型,以便在<textarea>元素更新时输入字段更新,反之亦然.某种双向绑定:)
问题是String本身看起来很难看,我想格式化它,所以它看起来像这样:
而不是现在看起来像:
有什么想法可以实现吗？如果您需要一些额外的信息 - 请不要犹豫.每个答案都受到高度赞赏并立即得到解答
谢谢.
PS我想这应该是某种指令或自定义过滤器.数据本身不应该被改变,只有输出.
iva*_*rni 426
Angular有一个内置的filter显示JSON
<pre>{{data | json}}</pre>
请注意使用pre-tag来保存空格和换行符
演示:
angular.module('app', [])
.controller('Ctrl', ['$scope',
function($scope) {
$scope.data = {
a: 1,
b: 2,
c: {
d: "3"
},
};
}
]);<!DOCTYPE html>
<html ng-app="app">
<head>
<script data-require="angular.js@1.2.15" data-semver="1.2.15" src="//code.angularjs.org/1.2.15/angular.js"></script>
</head>
<body ng-controller="Ctrl">
<pre>{{data | json}}</pre>
</body>
</html>还有一种angular.toJson方法,但我没有玩过(Docs)
- 应该是正确的答案! (19认同)
- 我遇到了问题,但我没有<pre> ....我看到了这个答案,我修好了......谢谢!! (3认同)
- @ ra170请仔细阅读整个问题,而不仅仅是标题.我要求的是一个与简单的json过滤器略有不同的东西. (2认同)
Luk*_*tor 62
您可以使用可选参数 JSON.stringify()
JSON.stringify(value[, replacer [, space]])参数
- value要转换为JSON字符串的值.
- replacer如果是一个函数,则转换字符串化时遇到的值和属性; 如果是数组,则指定最终字符串中对象中包含的属性集.有关替换器函数的详细说明,请参阅javaScript指南文章使用本机JSON.
- space 使得生成的字符串打印得很漂亮.
例如:
JSON.stringify({a:1,b:2,c:{d:3, e:4}},null," ")
会给你以下结果:
"{
"a": 1,
"b": 2,
"c": {
"d": 3,
"e": 4
}
}"
- 请注意,这会保留`$$ hashKey`属性角度用于内部模型跟踪 (5认同)
Moh*_*sen 23
如果您希望将JSON渲染为HTML并且可以折叠/打开它,您可以使用我刚才做的这个指令来很好地渲染它:
https://github.com/mohsen1/json-formatter/
Dan*_*ley 11
除了已经提到的角度json滤波器之外,还有角度toJson()函数.
angular.toJson(obj, pretty);
此功能的第二个参数允许您打开漂亮的打印并设置要使用的空格数.
如果设置为true,则JSON输出将包含换行符和空格.如果设置为整数,则JSON输出将包含每个缩进的许多空格.
(默认:2)
小智 5
我猜你想用它来编辑json文本。然后，您可以使用ivarni的方式：
{{数据| json}}
并添加一个adition属性 可编辑的
<pre contenteditable="true">{{data | json}}</pre>
Run Code Online (Sandbox Code Playgroud)
希望这可以帮到你。
| 归档时间： |
|
| 查看次数： |
185679 次 |
| 最近记录： |