Cookies concent notice

This site uses cookies from Google to deliver its services and to analyze traffic.
Learn more
Skip to main content
This site is no longer updated.Head to Angular.devHome
/

This is the archived documentation for Angular v17. Please visit angular.dev to see this page for the current version of Angular.

JsonPipe

Converts a value into its JSON-format representation. Useful for debugging.

      
      {{ value_expression | json }}
    

Exported from

Input value

value any

A value of any type to convert into a JSON-format string.

Usage notes

The following component uses a JSON pipe to convert an object to JSON format, and displays the string in both formats for comparison.

      
      @Component({
  selector: 'json-pipe',
  template: `<div>
    <p>Without JSON pipe:</p>
    <pre>{{ object }}</pre>
    <p>With JSON pipe:</p>
    <pre>{{ object | json }}</pre>
  </div>`,
})
export class JsonPipeComponent {
  object: Object = {foo: 'bar', baz: 'qux', nested: {xyz: 3, numbers: [1, 2, 3, 4, 5]}};
}