Question

我正在尝试使用.json文件中的数据填充许多图表。我根据需要使用一些虚拟/硬编码值（在plunker中注释掉），但是当我尝试添加.json文件/模型中的值时，它不起作用。

html模板：

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

控制器：

 series:[
    {
        data: ['part.before_hp','part.before_torque'], //this doesn't work
        //data: [2,3], //this works
        dataLabels: {
            enabled: true,
            color: '#FFFFFF',
            y: 40,
            style: {
                fontSize: '24px',
                fontFamily: 'tg, sans-serif',
                textShadow: '0 0 3px black'
            }
        },
        borderColor: 'transparent',
        pointPadding: 0.03
    },
    {
        data: ['part.after_hp','part.after_torque'], //this doesn't work
        //data: [5,6], //this works
        dataLabels: {
            enabled: true,
            color: '#FFFFFF',
            y: 40,
            style: {
                fontSize: '24px',
                fontFamily: 'tg, sans-serif',
                textShadow: '0 0 3px black'
            }
        },
        borderColor: 'transparent',
        pointPadding: 0.03
    }
],

我真的被困在这上面，一直在努力解决它，如果有人可以提供帮助我会非常感激。

我创建了这个plunker来展示我在做什么。

Answer 1

好吧，我明白了。这是一个更新的plunker - 真的希望这有助于其他人。

基本上我添加了'更新（部分）;'单击任何部件按钮时或在init上调用的函数，它会传递当前部件并使用它配置图表选项。

按钮选择部件：

<button class="btn btn-info" ng-click="selectLevel2($index); car.parts.selected=part.id; update(part);" ng-class="{selected: $index == partsSelected}">{{part.name}}</button>'

ng-init将在没有用户输入的情况下加载图表：

<div id="{{part.id}}" ng-if="car.parts.selected == part.id" class="my-switch-animation" ng-init="update(part);">
    <div ng-if="car.parts.selected == part.id" ng-class="{selected: $index == partSelected}" class="json">
        {{part}}
    </div>
    <highchart config="chartConfig"></highchart>
</div>

你可以在plunker代码中看到更新功能，我不想过多地混淆帖子： - ）

highcharts-ng模型数据不起作用

1 个答案: