javascript - 如何在 Angular JS 中以编程方式美化 JSON？

Question

我知道如何使用 javascript 以编程方式美化 JSON。这样我们就可以实现:

var obj = {"hello":"world", "Test":["hello"]}
document.body.innerHTML = "";
document.body.appendChild(document.createTextNode(JSON.stringify(obj, null, 4)));

但我尝试用 Angular JS 来做。但我无法实现这一点。这是我的步骤:

<div class="btn btn-primary" ng-click="test()">Press</div>
<textarea  json-formatter rows="20" cols="140" ng-model="json">
</textarea>

$scope.test=function(){
        var json=JSON.stringify($scope.json, null, "\t");
        /*here if $scope.json is {"hello":"world", "Test":["hello"]}
        then json return "{\"hello\":\"world\", \"Test\":[\"hello\"]}" */
}

这里如果$scope.json是{"hello":"world", "Test":["hello"]}然后 json 返回 "{\"hello\":\"world\",\"Test\":[\"hello\"]}" 。之后，我现在不知道如何将美化 json 显示到同一文本区域。如何解决这个问题。还有其他方法吗请建议我？

Answer 1

有一个内置功能用于过滤 json {{Object | json }}

您可以在代码中使用内置过滤器

{{dataObject | json}} 

会美化你的json，试试吧。

这是一个工作示例:

http://plnkr.co/edit/DM1TbN3eXGngJaFgi6n6?p=preview