Issue
I am knocking together a quick debugging view of a backend, as a small set of admin HTML pages (driven by angulardart, but not sure that is critical).
I get back from my XHR call a complex JSON object. I want to see that on the HTML page formatted nicely. It doesn’t have to be a great implementation, as its just a debug ui, but the goal is to format the object instead of having it be one long string with no newlines.
I looked at trying to pretty print JSON in dart then putting that inside <pre></pre>
tags, as well as just dumping the dart Map object to string (again, inside or not inside <pre></pre>
tags. But not getting to where I want.
Even searched pub for something similar, such as a syntax highlighter that would output html, but didn’t find something obvious.
Any recommendations?
Solution
I think what you’re looking for is:
- Format your JSON so it’s readable
- Have syntax highlight
For 1 – This can be done with JsonEncoder with indent
For 2 – You can use the JS lib called HighlightJs pretty easily by appending your formatted json into a marked-up div. (See highlightjs’ doc to see what I mean)
Answered By – Pacane
Answer Checked By – David Goodson (FlutterFixes Volunteer)