title: How to load the data in mdbCharts after the api call?
body: <p>I am using mdbChart to load the PieGraph. I need to load the data after I do the API call. But it's showing an error.</p>
  <p>My code is:</p>
  <pre><code>public chartType: string = 'pie';
  public chartDatasets: Array&lt;PieChart&gt; = new Array&lt;PieChart&gt;();
  public chartLabels: Array&lt;String&gt; = [];
  
  getPieChartData() {
      let element: PieChart = {data: [], label: &quot;&quot;};
      this.dashboard.getUniqueProductUsers().subscribe(data =&gt; {
        let chartValue: Array&lt;number&gt; = new Array();
        for(let uniqueProductUser of data.uniqueProductUser) {
          let obj: any = { ...uniqueProductUser };
          this.chartLabels.push(uniqueProductUser.product_type_info);
          chartValue.push(parseInt(obj.userscount))
        }
        element.data = chartValue;
        element.label = &quot;Product Traffic&quot;;
        this.chartDatasets.push(element);
        console.log(this.chartDatasets);
      })
    }
  </code></pre>
  <p>Interface is :</p>
  <pre><code>export interface PieChart {
    data: Array&lt;number&gt; ;
    label: String;
  }
  </code></pre>
  <p>And HTML code is as:</p>
  <pre><code>&lt;canvas mdbChart
              [chartType]=&quot;chartType&quot;
              [datasets]=&quot;chartDatasets&quot;
              [labels]=&quot;chartLabels&quot;
              [colors]=&quot;chartColors&quot;
              [options]=&quot;chartOptions&quot;
              [legend]=&quot;true&quot;&gt;
          &lt;/canvas&gt;
  </code></pre>
  <p>I am able to understand before I pushing data to the array is getting loaded. That's why I am getting configuration errors. How can I solve this issue?</p>