@angular/common

JsonPipe

pipe

stable

Impure

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

Pipe usage

{{ value_expression | json }}

API

    
      class JsonPipe implements PipeTransform {}

transform

string

@paramvalueany

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

@returnsstring

Description

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

Exported by

CommonModule

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>`,  standalone: false,})export class JsonPipeComponent {  object: Object = {foo: 'bar', baz: 'qux', nested: {xyz: 3, numbers: [1, 2, 3, 4, 5]}};}