Cookies concent notice

This site uses cookies from Google to deliver its services and to analyze traffic.
Learn more
Skip to main content
Angular has a new websiteHead 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]}};
}