Question

问题：如何让PrimeNg图表异步刷新？

场景：我有一个下拉列表，我想根据用户选择刷新图表。

我认为在获得对角度变化检测的理解以及如何重新分配对象以查看数据已被更改（而不是更新对象内的数据）之后我知道了这个问题的答案），但在阅读了许多其他图表甚至尝试它们之后，我才知道这个问题比我最初的想法要困难得多。

当我读到ng2-charts时，它们也构建了关于charts.js的指令，他们使用的解决方案在Angular中解决了这个问题。以下是他们的示例代码的摘录：

/**
* (My guess), for Angular to recognize the change in the dataset
* it has to change the dataset variable directly,
* so one way around it, is to clone the data, change it and then
* assign it;
**/

http://valor-software.com/ng2-charts/

即使他们对数据进行字符串化和重新分析以制作克隆副本并重新分配数据并且它似乎对他们有效，但我尝试使用PrimeNg这种方法并没有成功。

在其他示例中，他们对图表数据执行.slice（），或者直接访问CHART_DIRECTIVES并使用.update（）图表。他们还等待绘制图表，直到数据以异步方式加载，这只是第一次加载而不能解决我想要的行为。 Why should I practice Test Driven Development and how should I start?

我知道我的数据存在于幕后，我只需要知道如何刷新图表（即想出一种方法让Angular正确识别我已经改变了数据）。

Answer 1

我想要一个真实的＆＃34;解决方案，所以我去了源头。我被告知在4.0.0-rc.1之后，图表的行为发生了变化。我安装了4.0.0-rc.1并遵循以下示例并使其按预期工作。

   changeData() {
            this.changedData = {
                labels: ['X','Y','Z'],
                datasets: [
                    {
                        data: [200, 200, 50],
                        backgroundColor: [
                            "#50f442",
                            "#f441c4",
                            "#4195f4"
                        ],
                        hoverBackgroundColor: [
                            "#50f442",
                            "#f441c4",
                            "#4195f4"
                        ]
                     }]
            }
            this.data = Object.assign({}, this.changedData);

}

https://github.com/primefaces/primeng/issues/2235

你如何让Angular 2（或4）PrimeNg图表异步刷新？

1 个答案: