量角器-使用ng2-charts/Chart.js从Angular2中的画布属性获取数组

Question

我正在使用基于chart.js的ng2-charts，在我的Angular 2应用程序中使用它，我想用我的量角器测试在<canvas>元素的一个属性中检查一些数据。

我找不到访问数据的方法。我使用evaluate找到了解决方案，但我不确定这是针对Angular1还是针对2。

以下使用evaluate的解决方案对我不起作用：Test a Chart.js canvas with Protractor

我的画布设置：

  <div style="display: block">
    <canvas id="test" 
            [datasets]="chartData"
            [labels]="chartLabels"
            [options]="ChartOptions"
            [legend]="showRegions"
            [chartType]="barChartType" 
            height="100%"></canvas>
  </div>

加载页面时，canvas元素如下所示(为方便起见，我删除了label属性)。

<canvas id="test" ng-reflect-datasets="[object Object],[object Object]" ng-reflect-chart-type="bar" ng-reflect-legend="true"></canvas>

现在我找到我的canvas元素，如下所示：

var canvas = element(by.css("canvas#test[ng-reflect-datasets]"));

从这里开始我就被卡住了。如果我访问ng-reflect datasets属性，我只得到字符串"object Object...“但我需要这些对象中的值。

这有没有可能呢？

Answer 1

你试过这样做吗..。

var canvas = element(by.css("canvas#test[datasets]"));
canvas.evaluate("chartData").then(function (datasets) {
    // datasets is an array of objects that each have data, label, etc.
    console.dir(datasets[0].data);
});

注意，我只是从你问题中的SO答案+我对NG2图表的了解中得出这个结论(我以前没有使用过量角器)。