title: How to do Sum for total price inside Array in typescript and call it in angular 7
body: <p>I know that there is a lot of question about this but it really hard to find an answer that I can implement it. I want to make a function for sum a price but everytime I try to use loop it always give me <code>length property undefined</code></p>
  
  <p>some of topic that I try, but it still failed :</p>
  
  <p><a href="https://stackoverflow.com/questions/27879827/sum-of-object-properties-within-an-array">sum-of-object-properties-within-an-array</a></p>
  
  <p><a href="https://stackoverflow.com/questions/39887381/how-to-get-nested-array-length-in-javascript">how-to-get-nested-array-length-in-javascript</a></p>
  
  <p><a href="https://stackoverflow.com/questions/51427402/how-to-get-sum-from-array-using-javascript">how-to-get-sum-from-array-using-javascript</a></p>
  
  <p><a href="https://stackoverflow.com/questions/53835205/cannot-read-property-length-of-undefined-angular-7">cannot-read-property-length-of-undefined-angular-7</a></p>
  
  <p>this is my ts:</p>
  
  <pre><code>  allUnpaidTeam: []; //this is a variabel to store all my Json in my array
  
    formatPrice(value) {
      let val = (value/1)
      return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".")
    }
  
    totalPrice() {
      let total = 0;
      for(let data of this.allUnpaidTeam){
        for(let datas of data.contest){
          let sum = datas.pricePerStudent * data.memberPerTeam;
          total+= sum;
        }
      }
      return this.formatPrice(total);
    }
  
  </code></pre>
  
  <p>this is the example of the array json:</p>
  
  <pre><code>{
    "teams": [
      {
        "student": [
          {
            "team": null,
            "_id": "5d4e891cff5e00c9d5c28af9",
            "name": "John Swasneger",
            "email": "john.s@gmail.com",
            "phone": "098778900987",
            "school": "5d4e3e258311a9c3d43569d5",
            "__v": 0
          }
        ],
        "isPaid": false,
        "_id": "5d4e8aadff5e00c9d5c28afd",
        "name": "Team Garda Frosh",
        "contest": {
          "registrationStatus": "open",
          "_id": "5d4d8b19966460a59986e13c",
          "name": "Pizza Hunt",
          "memberPerTeam": 1,
          "maxTeam": 300,
          "pricePerStudent": 185000,
          "__v": 0
        },
        "school": "5d4e3e258311a9c3d43569d5",
        "__v": 0
      },
      {
        "student": [
          {
            "team": "5d4ebcd3af8eacd1a2317bfa",
            "_id": "5d4ebc19af8eacd1a2317bf7",
            "name": "lala",
            "email": "lala@gmail.com",
            "phone": "098778900987",
            "school": "5d4e3e258311a9c3d43569d5",
            "__v": 0
          },
          {
            "team": "5d4ebcd3af8eacd1a2317bfa",
            "_id": "5d4ebc35af8eacd1a2317bf8",
            "name": "lulu",
            "email": "lulu@gmail.com",
            "phone": "098778900987",
            "school": "5d4e3e258311a9c3d43569d5",
            "__v": 0
          }
        ],
        "isPaid": false,
        "_id": "5d4ebcd3af8eacd1a2317bfa",
        "name": "Team Landing Safe",
        "contest": {
          "registrationStatus": "open",
          "_id": "5d4d8b1a966460a59986e13d",
          "name": "burger knight",
          "memberPerTeam": 2,
          "maxTeam": 151,
          "pricePerStudent": 185000,
          "__v": 0
        },
        "school": "5d4e3e258311a9c3d43569d5",
        "__v": 0
      }
    ]
  }
  </code></pre>
  
  <p>this is my html:</p>
  
  <pre><code>              &lt;mat-grid-list class="section-title" cols="4" rowHeight="40px"&gt;
                  &lt;mat-grid-tile&gt;&lt;div class="table-text name last"&gt;Total&lt;/div&gt;&lt;/mat-grid-tile&gt;
                  &lt;mat-grid-tile&gt;&lt;div class="table-text-title"&gt;&amp;nbsp;&lt;/div&gt;&lt;/mat-grid-tile&gt;
                  &lt;mat-grid-tile&gt;&lt;div class="table-text-title"&gt;&amp;nbsp;&lt;/div&gt;&lt;/mat-grid-tile&gt;
                  &lt;mat-grid-tile&gt;&lt;div class="table-text price last"&gt;$ {{totalPrice()}}&lt;/div&gt;&lt;/mat-grid-tile&gt;
                &lt;/mat-grid-list&gt;
  
  </code></pre>
  
  <p>Can someone help me to solve this? </p>