javascript - 通过 highcharts-ng 指令将使用 highcharts 的图表添加到角度

Question

我想在我的角度应用程序中添加一个图表。我决定使用 highchart-ng 指令。这是控制器：

discoutControllers.controller('TestController', function($scope/*, $location,$route,TableUtility, TestService*/) {  

    $scope.options = {
            type: 'line'
        }

        $scope.swapChartType = function () {
            if (this.highchartsNG.options.chart.type === 'line') {
                this.highchartsNG.options.chart.type = 'column'
            } else {
                this.highchartsNG.options.chart.type = 'line'
            }
        }

        $scope.highchartsNG = {
            options: {
                chart: {
                    type: 'column'
                }
            },
            series: [{
                data: [10, 15, 12, 8, 7]
            }],
            title: {
                text: 'Hello'
            },
            loading: false
        }


});

这是视图：

<div ng-controller='TestController' id="container" style="min-width: 310px; height: 400px; margin: 0 auto">
                <highchart id="chart1" config="highchartsNG"></highchart>
            </div>

问题是当我查看我的页面时没有呈现任何内容，我不知道发生了什么。

问候，

Answer 1

https://github.com/pablojim/highcharts-ng

在这里您可以看到以下部分：

将 Highcharts 添加到您的 Angular 应用配置中：

var myapp = angular.module('myapp', ["highcharts-ng"]);

似乎由于没有引发错误，因此该指令实际上并未以角度实例化。这应该有帮助！

您也可能没有正确包含库。一切都应该在那个 git 页面上进行解释。