0

我正在尝试使用来自控制器的数组，该控制器在我的 html 文件中的某些 Javascript 中在该控制器中全局声明的 $scope 内。这可能吗？我试图实现 $rootScope 但没有取得多大成功，不确定实现是否存在问题，但首先调用 $rootScope 并且我在控制台中未定义，然后控制器在之后设置值。

这是我的控制器

function HomeCtrl($rootScope, $scope, $http, $filter){
    $rootScope.temp1 = [[gd(2016, 6, 1), 82], [gd(2016, 6, 7), 23], [gd(2016, 6, 14), 66]];
}

这是我的 JS 放在我的 HTML 中

    $(document).ready(function($rootScope) {

    console.log($rootScope.temp1);

    var data1 = $rootScope.temp1;

    var data2 = [
      [gd(2016, 6, 1), 82],
      [gd(2016, 6, 7), 23],
      [gd(2016, 6, 14), 66],
      [gd(2016, 6, 21), 9],
      [gd(2016, 6, 28), 119],
      [gd(2016, 6, 29), 6],
      [gd(2016, 6, 30), 9]
    ];

    var data3 = [
      [gd(2016, 6, 1), 822],
      [gd(2016, 6, 7), 232],
      [gd(2016, 6, 14), 626],
      [gd(2016, 6, 21), 92],
      [gd(2016, 6, 28), 1219],
      [gd(2016, 6, 29), 62],
      [gd(2016, 6, 30), 92]
    ];
    $("#canvas_dahs").length && $.plot($("#canvas_dahs"), [
      data1, data2, data3
    ], {
      series: {
        lines: {
          show: false,
          fill: true
        },
        splines: {
          show: true,
          tension: 0.4,
          lineWidth: 1,
          fill: 0.4
        },
        points: {
          radius: 0,
          show: true
        },
        shadowSize: 2
      },
      grid: {
        verticalLines: true,
        hoverable: true,
        clickable: true,
        tickColor: "#d5d5d5",
        borderWidth: 1,
        color: '#fff'
      },
      colors: ["rgba(38, 185, 154, 0.38)", "rgba(3, 88, 106, 0.38)"],
      xaxis: {
        tickColor: "rgba(51, 51, 51, 0.06)",
        mode: "time",
        tickSize: [1, "day"],
        //tickLength: 10,
        axisLabel: "Date",
        axisLabelUseCanvas: true,
        axisLabelFontSizePixels: 12,
        axisLabelFontFamily: 'Verdana, Arial',
        axisLabelPadding: 10
      },
      yaxis: {
        ticks: 8,
        tickColor: "rgba(51, 51, 51, 0.06)",
      },
      tooltip: false

    });

    function gd(year, month, day) {
      return new Date(year, month - 1, day).getTime();
    }
  });
4

1 回答 1

0

We cannot pass AngularJs variables into a standalone JS chart library and need to use a chart that connects directly with the call. I found two of these and practically implemented angular-chart.js which @Nemeros suggested.

The other was Angular-nvD3 which I tested and it worked successfully.

于 2017-01-11T03:30:02.547 回答