0

I add a json which send me that

{"idCommande":73864,"status":"error"}

My issue is when I put my json in

<code>
    <pre>
        {{ jsonFormatter | json}}
    </pre>
</code>

it add automatically in my json whitespace before my first { and after my last } for no reason.

I already try to do JSON.parse(JSON.stringify(response.data).replace(/\s(?=\w+":)/g, ""))

But it's still the same issue

whitespace

user10863293
  • 770
  • 4
  • 11
  • 32

1 Answers1

2

<pre> preserves whitespace, including the initial indentation. You could make sure the initial expression is not indented, like so:

<code>
    <pre>
{{ jsonData | json }}
    </pre>
</code>

Only problem is that it doesn't look great, and your IDE might "fix" the indentation at some point without you noticing. A better way is to just use ng-bind. Not only is it a more performant best practice, but it also happens to address your issue as well by not including leading whitespace.

<code>
    <pre ng-bind="jsonData | json"></pre>
</code>

P.S. I renamed jsonFormatter to jsonData in my example because I really couldn't make any sense of passing a formatter into AngularJS's json filter, which is itself a formatter. Consider a better name for this property.

Jacob Stamm
  • 1,660
  • 1
  • 29
  • 53
  • just what i needed... if you are in angular 2+ and want to use the equivalent of `ng-bind`, see this: https://stackoverflow.com/a/39582803/7085047 – Datum Geek Aug 14 '22 at 10:12