title: Angular - Show the current length value from a shop cart items(ecommerce) Rxjs on my template
body: <p>im try do a counter for the items number of my shopcart. This counter I will show in my home page using Angular 9.</p>
  <p>A function return the current number of items from my shopcart, and my template shows through a property the value of my function. Using Observables i thought the property show the current value of items from my shopcart without reload the page, but this dont happen like that. What did I forget to do before?</p>
  <p>code .ts</p>
  <pre><code>import { Observable, of } from 'rxjs';
  
  
  constructor() { 
  
        this.NumItemsCart().subscribe(
        value =&gt;  {this.num_item = value},
        error =&gt; console.log('was an issue here', error),
        ()=&gt; console.info('Obs completed')
      )
    }
  
    NumItemsCart():Observable&lt;number&gt;{
      let string_items = '';
      let array_temp = [];
      let num_items=0;
      
      string_items = localStorage.getItem('ecmm_list_shopcart');
  
      array_temp= string_items.split(',')
      
      num_items= array_temp.length -1
  
      return of(num_items)
    }
  </code></pre>
  <p>code template</p>
  <pre><code>&lt;mat-toolbar&gt;
      &lt;div *ngIf=&quot;(num_item) &gt; 0&quot;&gt;{{num_item}}&lt;/div&gt;
  &lt;/mat-toolbar&gt;
  </code></pre>