Question

我使用AngularJS使用Highchart图表库，使用Pablojim's 'Highchart-ng' module。

所有内容都已正确设置，以下代码按预期工作：

<highchart config="{
    type    : 'line',
    series  : [{
        name    : 'Visitors', 
        data    : [1, 4, 10, 3]
    }]
}"></highchart>

但是

<highchart config="{
    type    : 'line',
    series  : [{
        name    : 'Visitors', 
        data    : {{visitors}}
    }]
}"></highchart>

没有。（注意＆＃39;数据＆＃39; ）的差异

我一直收到以下错误：

Error: [$parse:syntax] Syntax Error: Token 'visitors' is unexpected, expecting [:] at column 122 of the expression [{
    type    : 'line',
    series  : [{
        name    : 'Visitors', 
        data    : {{visitors}}
    }]
}] starting at [visitors}}
    }]
}].

注意：变量{{visitor}}在我的控制器中正确设置，在我的模板中使用时，数据工作正常。它还曾用于我之前的图表库Flot。

我尝试了多种解决方法：

通常我可以通过在指令中添加类似ng-repeat="data in visitors | limitTo: 1"之类的东西来解决这个问题（初始化）问题，因此只有在变量可用时才会出现（这适用于Flot和EasyPieCharts）。
添加ui-refresh="visitors"无效，
和data: {{visitors || 0}}也不起作用。

那么，如何在模板文件中添加内联变量？

Answer 1

你可以试试：

<highchart config="{
    type    : 'line',
    series  : [{
        name    : 'Visitors', 
        data    : visitors
    }]
}"></highchart>

像var

OR

在ng-controller

中

$scope.config = { 
    options: { 
        chart: { type: 'bar' } 
    }, 
    series: [{ 
        data: visitors 
    }], 
    title: { text: 'Hello' }, 
    loading: false }

然后在你的HTML中

<highchart config="config"></highchart>

AngularJS中具有内联变量的Highcharts（使用Pablojim＆＃39; Highchart-ng）

1 个答案: