将angularjs货币绑定到chart.js中的scaleLabel

Question

我正在使用Angularjs，Chartjs可以将货币绑定到scaleLabel。 在HTML中，我通常会

{{value | currency }} 

这是来自chartjs图形选项的标签

scaleLabel: "<%= '$' + value  %>"

有没有办法代替硬编码货币呢？

这是我在其中调用控制器和$ scopes的HTML

<div ng-controller="ChartJSController" class="container-fluid">
<div class="row mb-lg">
    <div class="col-lg-12">
        <div>
            <canvas linechart="" options="lineOptions" data="rev" height="667" responsive="true"></canvas>
        </div>
    </div>
</div>

这是图形数据

    $scope.revenueToday = {
    labels: ['00:00', '01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00', '08:00'],
    datasets: [
      {
          label: 'My Second dataset',
          fillColor: 'rgba(35,183,229,0.2)',
          strokeColor: 'rgba(35,183,229,1)',
          pointColor: 'rgba(35,183,229,1)',
          pointStrokeColor: '#fff',
          pointHighlightFill: '#fff',
          pointHighlightStroke: 'rgba(35,183,229,1)',
          data: log

      }
    ]
};

这是我设置图形选项的地方

    $scope.lineOptions = {
    scaleShowGridLines: true,
    scaleGridLineColor: 'rgba(0,0,0,.05)',
    scaleGridLineWidth: 1,
    bezierCurve: true,
    bezierCurveTension: 0.4,
    pointDot: true,
    pointDotRadius: 4,
    pointDotStrokeWidth: 1,
    pointHitDetectionRadius: 20,
    datasetStroke: true,
    datasetStrokeWidth: 2,
    datasetFill: true,
    scaleLabel: "<%= '$' + value  %>"

};

Answer 1

您可以执行此操作，但是您必须添加一些代码来对某些全局对象（IMO不太易于维护）进行格式化。 这就是你的做法

myApp.controller('myCtrlr', ['$filter', '$scope', function ($filter, $scope) {
    Chart.currencify = function(value) {
        return $filter('currency')(value);
    }
    ...
    ...
    var myChart = new Chart(ctx).Line(data, {
        scaleLabel: "<%=Chart.currencify(value)%>",
    });
}]);

您可以将currencify函数附加到任何全局对象（我已将其添加到Chart js全局对象）。 您只需要确保在初始化图表之前就定义了currencify （因此也可以在myApp.run ）。

---

小提琴-http: //jsfiddle.net/fntcdtve/