如何取消注册图表插件？

Question

使用 Chart.pluginService.register 我在图表上画了一条线以满足页面 B 上的某些要求（可以说）。我从页面 A 转到页面 B。

现在，当我返回页面 A 并再次转到页面 B 时，图表上绘制的线条开始变暗。

当我返回页面 A 时如何取消注册该插件？

我在此源上看到了取消注册和清除功能： https://github.com/chartjs/Chart.js/blob/647dc582cd85fc8e25d49cf0e38d459c582b2652/src/core/core.plugin.js

注销函数没有任何作用。清除功能会清除先前绘制的线条，但图表的图例会消失。

Answer 1

添加

ngOnDestroy() {
  Chart.pluginService.unregister(this.horizonalLinePlugin);
}

在你ProductDetailComponent应该做的伎俩。

https://stackblitz.com/edit/angular-uxfwqb?file=src/app/product-detail/product-detail.component.ts

这里的问题是，如果您同时有多个可见的图表组件，则该插件将在所有其他图表中可见。

更好的修复：

1. 仅在 ngInit 之外直接在模块文件或全局某处注册插件一次。这将影响整个应用程序中的所有图表，但无需注销它，因此很明显，它是影响所有图表的全局因素。

2. 通过chart.js（或angular2-chartjs的拉取请求）创建您自己的包装器组件/指令，它可以接受输入plugins并将其传递给Chart构造函数http://www.chartjs.org/docs/latest/developers/plugins。 html： var chart1 = new Chart(ctx, { plugins: [plugin] });这将允许您拥有一个带有插件的图表和一个没有插件的图表，因此无需注册/取消注册全局插件。