gpt4 book ai didi

angular - 如何在 codemirror 上显示 JSON?

转载 作者:行者123 更新时间:2023-12-04 04:08:00 25 4
gpt4 key购买 nike

目前我正在使用 ngx-codemirror - codemirror 上的 Angular 包装器。

在我的应用程序中

html 显示

<ngx-codemirror [(ngModel)]="data" [autoFocus]=true [options]="{lineNumbers: true,theme: 'material',mode: 'markdown'}"></ngx-codemirror>

如图所示

data='';
json = {
"title": "Type",
"description": "A type of product",
"type": "object"
};

constructor(){
this.data = JSON.stringify(this.json);
}

它在一行中正确显示了 json 文本,但我想在一行中以 json 格式而不是字符串显示它。

我该怎么做?

最佳答案

您可以在 JSON.stringify() 中发送一个空的空白字符作为 space 参数方法。尝试以下操作

Controller

data = '';
json = {
"title": "Type",
"description": "A type of product",
"type": "object"
};

ngOnInit() {
this.data = JSON.stringify(this.json, null, ' '); // <-- string literal ' ' as `space` argument
}

您还可以通过发送数字来修改缩进空间。例如。 JSON.stringify(this.json, null, 4)表示缩进4个空格

模板

<ngx-codemirror #codemirror
[options]="codeMirrorOptions"
[(ngModel)]="data"
(ngModelChange)="setEditorContent($event)">
</ngx-codemirror>

工作示例:Stackblitz

关于angular - 如何在 codemirror 上显示 JSON?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62189788/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com