javascript - 具有 Angular 和 ionic 框架错误的 Highcharts

Question

我想在我的网络应用程序上制作图表。

我不明白 Angular 与 highcharts 是如何工作的。

我使用这个库:github.com/pablojim/highcharts-ng 这个框架:ionicframework.com/

我认为apache cordova也可以这样。

我做了一个简单的页面:

<highchart id="chart1" config="chartConfig"></highchart>

然后，在我的 app.js 上:

var app = angular.module('myApp', ['ionic', 'ui.router', 'highcharts-ng']);

然后在我的 Controller js 页面上:

angular.module('myApp').controller('Dashboard',....) 
{
    $scope.chartConfig = {
        options: {
            chart: {
                type: 'bar'
            }
        },
        series: [{
            data: [10, 15, 12, 8, 7]
        }],
        title: {
            text: 'Hello'
        },

        loading: false
    };

}

当然:没有图表，js 控制台上出现错误:

TypeError: undefined is not a function
    at Object.Xa.init (http://localhost:63342/www/js/highcharts.js:190:242)
    at Object.Xa (http://localhost:63342/www/js/highcharts.js:15:293)
    at link.m (http://localhost:63342/www/js/highcharts-ng.min.js:8:2964)
    at link (http://localhost:63342/www/js/highcharts-ng.min.js:8:3058)
    at http://localhost:63342/www/lib/ionic/js/ionic.bundle.js:15996:44
    at nodeLinkFn (http://localhost:63342/www/lib/ionic/js/ionic.bundle.js:15605:13)
    at compositeLinkFn (http://localhost:63342/www/lib/ionic/js/ionic.bundle.js:15009:15)
    at nodeLinkFn (http://localhost:63342/www/lib/ionic/js/ionic.bundle.js:15599:24)
    at compositeLinkFn (http://localhost:63342/www/lib/ionic/js/ionic.bundle.js:15009:15)
    at compositeLinkFn (http://localhost:63342/www/lib/ionic/js/ionic.bundle.js:15012:13) <div id="chart1" config="chartConfig"> 

我的问题:

• 如果我将依赖项放在

  angular.module('myApp', ['highcharts-ng']).controller('Dashboard',....)
  

空白页面，所以我假设它仅在 app.js 上......对还是错？

• 如何解决我的问题？

PS:对于 JSFiddle 或 CodePen 用户，这是您的礼物: http://codepen.io/anon/pen/ateyI

不完全是我的项目，但重现了这个问题。 谢谢!

Answer 1

使用 Chrome 的 Web 检查器进行调试。对我来说，当我遇到同样的错误时，addEvent 函数就是罪魁祸首。检查定义让我意识到我忘记包含jquery。我怀疑你也有同样的情况。