title: Google Charts DataTable no longer working after upgrades in .NET Core and Angular version
body: <p>I have been upgrading my build environment and have broken my Google DataTable code.  Changes from the working version to the broken version include</p>
  
  <ul>
  <li>upgrading .NET Core from 2.1 to 3.1,</li>
  <li>upgrading from Angular 5 to 8.2,</li>
  <li>placing the chart code in a feature module.</li>
  </ul>
  
  <p>The last item is highly suspect, but other chart code in the module appears to be working.  So anyway, the relevant code that was working perfectly before follows:</p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { HttpClient } from '@angular/common/http';
  
  declare var google: any;
  
  @Component({
  selector: 'google-chart',
  templateUrl: './google-chart.component.html',
  styleUrls: ['./google-chart.component.css']
  })
  export class GoogleChartComponent implements OnInit {
  
  public chartData: any;
  public dataTable: any;
  
  public options = {
      title: 'Google Line Chart Example',
      width: 600,
      height: 370
  };
  
  constructor(
      private http: HttpClient) {
  }
  
  ngOnInit() {
  
  google.charts.load('current', { 'packages': ['corechart'] });
  
  this.http.get('api/binomialresults/getgooglechartdata') 
          .subscribe((response: any) =&gt; {
              this.chartData = response;
              this.dataTable = new google.visualization.DataTable(this.chartData);
              google.charts.setOnLoadCallback(this.drawChart.bind(this));
          });
  }
  private drawChart(this: any) {
  
      var chart = new google.visualization.LineChart(document.getElementById('chartDiv'));
  
      chart.draw(this.dataTable, this.options);
  }
  
  }
  </code></pre>
  
  <p>Here is the module definition:</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  
  import { GoogleChartComponent } from './google-chart.component';
  import { GoogleTestChartComponent } from './google-test-chart.component';
  
  @NgModule({
    imports: [
      CommonModule
    ],
    declarations: [
      GoogleChartComponent,
      GoogleTestChartComponent
    ],
    exports: [
      GoogleChartComponent,
      GoogleTestChartComponent
    ],
    providers: [
    ],
  
  })
  export class GoogleChartsModule { }
  </code></pre>
  
  <p>And finally, here is the error, captured from the Chrome console:
  <a href="https://i.stack.imgur.com/JPinL.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JPinL.png" alt="enter image description here"></a></p>
  
  <p>There are no errors apparent in the visual studio console and the content of this.chartData can be seen as good in the debugger.  The error message is thrown on setting the value for this.dataTable.  I have researched the "Cannot read property of 'DataTable' of undefined" error and the usual answers involve failure to load the google charts environment.  That is not the case here, or at least I am using the load statement that works elsewhere.</p>
  
  <p>Any suggestions?</p>