title: Display ngForm data via Json Pipe Angular 9 project not showing any data. Converting circular structure to JSON ERROR
body: <p>I am trying to display my ngForm data in the HTML file using the Json pipe in my Angular 9 project.</p>
  
  <p>The result I wish to get from the below code should be</p>
  
  <pre><code>{"name":"name input","contactNumber":"07123" }
  </code></pre>
  
  <p>I tried this:</p>
  
  <pre><code>{{ form.value | json }}
  </code></pre>
  
  <p>and I have also tried</p>
  
  <pre><code>{{ form| json }}
  </code></pre>
  
  <p>to display <strong>all</strong> angular ngForm data, but still no luck.</p>
  
  <p>On my HTML nothing is being shown, but if I do <code>{{form}}</code>, I get <code>[object object]</code>.</p>
  
  <p>Note: FORMS MODULE is imported.</p>
  
  <p>The error I am getting on the console:</p>
  
  <pre><code>VM21 vendor.js:15247 ERROR TypeError: Converting circular structure to JSON
      --&gt; starting at object with constructor 'TView'
      |     property 'blueprint' -&gt; object with constructor 'LViewBlueprint'
      --- index 1 closes the circle
      at JSON.stringify (&lt;anonymous&gt;)
      at JsonPipe.transform (VM21 vendor.js:5866)
      at Module.ɵɵpipeBind1 (VM21 vendor.js:43023)
      at BookingFormComponent_Template (VM20 main.js:579)
      at executeTemplate (VM21 vendor.js:20324)
      at refreshView (VM21 vendor.js:20171)
      at refreshComponent (VM21 vendor.js:21609)
      at refreshChildComponents (VM21 vendor.js:19900)
      at refreshView (VM21 vendor.js:20223)
      at refreshComponent (VM21 vendor.js:21609)
  </code></pre>
  
  <p>HTML code:</p>
  
  <pre><code>&lt;form #form="ngForm" class="box p-4 mx-lg-0 mx-1 mb-3 rounded font-weight-bold"&gt;
  &lt;div class="form-group"&gt;
  &lt;label for="clientName"&gt;Name&lt;/label&gt;
  &lt;input id="clientName"  placeholder="Enter your name!" ngModel/&gt;
  &lt;/div&gt;
  &lt;div class="form-group"&gt;
  &lt;label for="contactNumber"&gt;Contact Number&lt;/label&gt;
  &lt;input id="contactNumber"  placeholder="Enter your contact number!" ngModel/&gt;
  &lt;/div&gt;
  &lt;h3&gt;{{ form | json }}&lt;/h3&gt;
  &lt;h3&gt;{{ form.value | json }}&lt;/h3&gt;
  </code></pre>