Try to release as much resources as possible

might help with #125 and #145

projects/ng2-google-charts/src/lib/google-chart/google-chart.component.ts

@@ -4,6 +4,7 @@ import {
   Component,
   ElementRef,
   OnInit,
+  OnDestroy,
   Input,
   Output,
   EventEmitter
@@ -61,7 +62,7 @@ export enum GoogleChartType {
   selector: 'google-chart',
   template: '<div></div>',
 })
-export class GoogleChartComponent implements OnInit {
+export class GoogleChartComponent implements OnInit, OnDestroy {
 
   @Input() public data!: GoogleChartInterface;
 
@@ -118,6 +119,26 @@ export class GoogleChartComponent implements OnInit {
     });
   }
 
+  ngOnDestroy() {
+    try {
+      const chart = this.wrapper.getChart();
+      chart.clearChart();
+      chart.hv = {}; chart.iv = {}; chart.jv = {};
+      Object.keys(chart).forEach(function(key) { delete chart[key]; });
+    } catch (e) { }
+    try {
+      delete this.data.component;
+    } catch (e) { }
+
+    this.el.nativeElement.innerHTML = '';
+    this.el.nativeElement.remove();
+
+    try {
+      Object.keys(this.wrapper).forEach((key) => { delete this.wrapper[key]; });
+      delete this.wrapper;
+    } catch (e) { }
+  }
+
   public async init() {
     await this.loaderService.load();
     this.recreateWrapper();

projects/ng2-google-charts/src/lib/google-charts-control/google-charts-control.component.ts

@@ -8,7 +8,10 @@ export interface GoogleChartsControlInterface {
 }
 
 import {
-  Component, OnInit, Input,
+  Component,
+  OnInit,
+  OnDestroy,
+  Input,
   ElementRef
 } from '@angular/core';
 
@@ -21,7 +24,7 @@ interface InternalGoogleChartsControlOptions extends GoogleChartsControlInterfac
   selector: 'google-charts-control',
   template: '<div></div>',
 })
-export class GoogleChartsControlComponent implements OnInit {
+export class GoogleChartsControlComponent implements OnInit, OnDestroy {
 
   @Input() public data!: GoogleChartsControlInterface;
 
@@ -37,6 +40,15 @@ export class GoogleChartsControlComponent implements OnInit {
     this.data.component = this;
   }
 
+  ngOnDestroy() {
+    this.el.nativeElement.innerHTML = '';
+    this.el.nativeElement.remove();
+    try{
+      Object.keys(this.wrapper).forEach((key) => { delete this.wrapper[key]; });
+      delete this.wrapper;
+    } catch (e) { }
+  }
+
   public async ensureInit() {
     if (this.wrapper) {
       return;

projects/ng2-google-charts/src/lib/google-charts-dashboard/google-charts-dashboard.component.ts

@@ -4,6 +4,7 @@ import {
   Component,
   ElementRef,
   OnInit,
+  OnDestroy,
   Input,
 } from '@angular/core';
 
@@ -26,7 +27,7 @@ export interface GoogleChartsDashboardInterface extends
   selector: 'google-charts-dashboard',
   template: '<div></div>',
 })
-export class GoogleChartsDashboardComponent implements OnInit {
+export class GoogleChartsDashboardComponent implements OnInit, OnDestroy {
 
   @Input() public data!: GoogleChartsDashboardInterface;
 
@@ -53,6 +54,15 @@ export class GoogleChartsDashboardComponent implements OnInit {
     });
   }
 
+  ngOnDestroy() {
+    this.el.nativeElement.innerHTML = '';
+    this.el.nativeElement.remove();
+    try {
+      Object.keys(this.dashboard).forEach((key) => { delete this.dashboard[key]; });
+      delete this.dashboard;
+    } catch (e) {}
+  }
+
   public async init() {
     await this.loaderService.load({packages: ['controls'] });
 

projects/ng2-google-charts/src/lib/google-charts-datatable.ts

@@ -218,4 +218,8 @@ export class GoogleChartsDataTable {
       }
     }
   }
+
+  public delete() {
+    Object.keys(this.dataTable).forEach((key) => { delete this.dataTable[key]; });
+  }
 }