我有一个指令,用于在格式化后显示JSON文件的内容。
.directive('jsonText', function() {
return {
restrict: 'A',
require: 'ngModel',
scope: {
ngModel: "="
},
link: function(scope, element, attr, ngModel) {
update();
function update() {
var data = scope.ngModel;
console.log(JSON.stringify(attr)+" to ---> "+angular.toJson(data,true));
scope.ngModel = angular.toJson(data,true);
}
}
};});
我的HTML代码是
<div class="col-md-12">
<textarea ng-model="jsondata" readonly json-text rows="10" name="jsonfile" id="jsonfile" style="resize: none"></textarea>
</div>
所以它会发生多步形式,所以我多次导航到这个代码。
所以第一次到达它时,它的格式正确。
{
"subjectareaname": "Defects",
"feedname": "Feed for Jira",
"description": "Feed for Jira",
"datafeedfor": "application",
"name": "Log4jphp"
}
但第二次发生这样的事情。
"{\n \"subjectareaname\": \"Defects\",\n \"feedname\": \"Feed for Jira\",\n \"description\": \"Feed for Jira\",\n \"datafeedfor\": \"application\",\n \"name\": \"Log4jphp\"\n}"
我该如何避免这种情况?有什么办法可以强迫它只运作一次。
答案 0 :(得分:2)
这是因为你用这一行覆盖了scope.ngModel:
scope.ngModel = angular.toJson(data,true);
这意味着下次进入时,数据实际上会被更改。 Angular已经为你提供了一个漂亮的json滤镜,所以要完成你正在做的事情,你可以得到这样的东西:
<pre>{{ jsonData | json }}</pre>
你可以在这个小提琴中看到它:http://jsfiddle.net/o0d5kdv6/