Home / Questions / 133325
Accepted
sirdaiz
Asked: 2020-01-25 03:58:24 +0800 CST 2020-01-25 03:58:24 +0800 CST

验证 JSON 并将其格式化打印

  • 772

假设我将一个字符串复制到一个 textarea 中，例如：

var str = "{ hello: 'world', places: ['Africa', 'America', 'Asia', 'Australia'] }";

所以我JSON.parse(str)以 JSON 格式解析字符串，但我想在 textarea 或类似的格式中显示结果 -

此外，如果您在其中修改了某些内容并且它是错误的，那就是一个错误。类似于这个网站的东西：https ://jsonformatter.org/

我的处理程序：

$scope.toParseJson= function (str) {
   $scope.jsonValue = str;
}

$scope.validateJson= function (str) {
   $scope.errors= JSON.parse(str);
}

我的 html

<textarea ng-change="toParseJson(str)" ng-model="str"></textarea><br>
{{errors}}<br>
<textarea ng-change="validateJson(str)" ng-model="jsonValue "></textarea>

1-我如何在第二个文本区域中显示它的列表和区分顺序？

2-是否有另一种优雅的方式来显示错误？

javascript

1 Answers

  1. Best Answer

    验证 JSON

    如果语法无效，JSON.parse()方法会抛出SyntaxError ：

    let textoJSON = '{ "hello": "world" <<<ERROR>>> "places": ["Africa", "America", "Asia", "Australia"] }',
    objeto;

try {
    objeto = JSON.parse(textoJSON);
    console.log('Sintaxis Correcta');
}
catch (error) {
    if(error instanceof SyntaxError) {
        let mensaje = error.message;
        console.log('ERROR EN LA SINTAXIS:', mensaje);
    } else {
        throw error; // si es otro error, que lo siga lanzando
    }
}


    打印格式化的 JSON

    JSON.stringify ()方法将对象转换为 JSON，并接受第三个参数，其中包含用于每个选项卡的空格数。我将结果打印在一个尊重空格的容器中（例如： a<pre>或 a <textarea>）。

    let textoJSON = '{ "hello": "world", "places": ["Africa", "America", "Asia", "Australia"] }',
    objeto;
    
//Teniendo un objeto...
objeto = JSON.parse(textoJSON);

//Lo convertimos a JSON formateado con 2 espacios
let textoFormateado = JSON.stringify(objeto, undefined, 2);

//Imprimimos
document.write('<pre>' + textoFormateado + '</pre>');

    • 5