JSON 字符串化 AngularJS 即时转换

Question

为什么我不能使用这样的东西？

<input type="text" ng-model="testVal">
<pre>{{JSON.stringify(testVal,null,4)}}</pre>

如果我删除 JSON.stringify() 方法，我的代码就可以正常工作。

Answer 1

双括号语法 {{something}} 告诉 angular 在 $scope 对象中查找匹配项。

因此 {{name}} 与控制器中设置的 $scope.name 匹配。

您可以使用此处的方法（我建议您使用它来保持视图文件的清洁），这将解决您的问题。

所以在控制器中：

$scope.stringify = function(value, replacer, space)
{
    return JSON.stringify(value,replacer,space);
}

...那么在您看来：

<pre>{{stringify(testVal,null,4)}}</pre>

Answer 2

您可以直接在控制器中分配功能：

$scope.stringify = JSON.stringify;

Answer 3

你可以简单地使用 | json :

{{ testVal | json }}

或将 JSON 添加到 $scope :

$scope.JSON = JSON

然后

<pre>{{ JSON.stringify(testVal) }}</pre>

有效

JSON stringify with AngularJS on the fly transformation