Can you run Highcharts with dynamic data in angular JS with require.js?

Question

HTML

<div class="row"> <div class="col-md-12"> <div class="thumbnail alert-info alert alert-dismissible fade in"> <p class="lead text-center"> Our Dynamic KPI</p> </div> </div> </div> <script src="scripts/cad.js"></script> <div id="container" class="chart"></div> 

Js script

 $.get('scripts/dataCAD.csv', function(csv) { $('#container').highcharts({ chart: { type: 'column' }, data: { csv: csv }, title: { text: 'CAD' }, yAxis: { title: { text: 'Units' } } }); }); 

Component in angular 2

 import {Component} from '@angular/core'; @Component({ selector: 'cad', templateUrl: './cad.html' }) export class cadcomponent { } 

I have other scripts working in my application using require.js and all of them work fine, however I do not get an error in the console for this page of tall charts, but the data is not displayed.

I looked at this frequently asked questions link , but could not get it to work. if anyone has experience with high charts and angular 2, any help would be greatly appreciated!