From a3a707b64d444dafd9a17331b0942ad3d725234f Mon Sep 17 00:00:00 2001 From: mehmet-erim Date: Mon, 20 Sep 2021 08:24:51 +0300 Subject: [PATCH] imporove chart component --- .../apps/dev-app/src/app/app.module.ts | 2 -- .../chart.js/src/chart.component.ts | 18 +++++------ .../components/chart.js/src/chart.module.ts | 31 ++++--------------- 3 files changed, 14 insertions(+), 37 deletions(-) diff --git a/npm/ng-packs/apps/dev-app/src/app/app.module.ts b/npm/ng-packs/apps/dev-app/src/app/app.module.ts index 21eb869af0..9c89658357 100644 --- a/npm/ng-packs/apps/dev-app/src/app/app.module.ts +++ b/npm/ng-packs/apps/dev-app/src/app/app.module.ts @@ -1,5 +1,4 @@ import { AccountConfigModule } from '@abp/ng.account/config'; -import { ChartModule } from '@abp/ng.components/chart.js'; import { CoreModule } from '@abp/ng.core'; import { registerLocale } from '@abp/ng.core/locale'; import { IdentityConfigModule } from '@abp/ng.identity/config'; @@ -32,7 +31,6 @@ import { APP_ROUTE_PROVIDER } from './route.provider'; TenantManagementConfigModule.forRoot(), SettingManagementConfigModule.forRoot(), ThemeBasicModule.forRoot(), - ChartModule.forRoot() ], providers: [APP_ROUTE_PROVIDER], declarations: [AppComponent], diff --git a/npm/ng-packs/packages/components/chart.js/src/chart.component.ts b/npm/ng-packs/packages/components/chart.js/src/chart.component.ts index abf9cae4e5..a1066eac66 100644 --- a/npm/ng-packs/packages/components/chart.js/src/chart.component.ts +++ b/npm/ng-packs/packages/components/chart.js/src/chart.component.ts @@ -9,7 +9,7 @@ import { OnChanges, OnDestroy, Output, - SimpleChanges + SimpleChanges, } from '@angular/core'; let Chart: any; @@ -49,8 +49,7 @@ export class ChartComponent implements AfterViewInit, OnDestroy, OnChanges { @Output() dataSelect = new EventEmitter(); - initialized: boolean - + @Output() initialized = new EventEmitter(); chart: any; @@ -60,7 +59,7 @@ export class ChartComponent implements AfterViewInit, OnDestroy, OnChanges { import('chart.js/auto').then(module => { Chart = module.default; this.initChart(); - this.initialized = true; + this.initialized.emit(true); }); } @@ -99,15 +98,15 @@ export class ChartComponent implements AfterViewInit, OnDestroy, OnChanges { data: this.data, options: this.options, }); - } + }; getCanvas = () => { return this.el.nativeElement.children[0].children[0]; - } + }; getBase64Image = () => { return this.chart.toBase64Image(); - } + }; generateLegend = () => { if (this.chart) { @@ -124,14 +123,13 @@ export class ChartComponent implements AfterViewInit, OnDestroy, OnChanges { reinit = () => { if (!this.chart) return; - this.chart.destroy(); - this.initChart(); + this.chart.destroy(); + this.initChart(); }; ngOnDestroy() { if (this.chart) { this.chart.destroy(); - this.initialized = false; this.chart = null; } } diff --git a/npm/ng-packs/packages/components/chart.js/src/chart.module.ts b/npm/ng-packs/packages/components/chart.js/src/chart.module.ts index 58a0ccc84f..a34570dc84 100644 --- a/npm/ng-packs/packages/components/chart.js/src/chart.module.ts +++ b/npm/ng-packs/packages/components/chart.js/src/chart.module.ts @@ -1,30 +1,11 @@ import { CommonModule } from '@angular/common'; -import { APP_INITIALIZER, Injector, ModuleWithProviders, NgModule } from '@angular/core'; +import { NgModule } from '@angular/core'; import { ChartComponent } from './chart.component'; -declare const Chart: any - @NgModule({ - imports: [CommonModule], - exports: [ChartComponent], - declarations: [ChartComponent], - providers: [], + imports: [CommonModule], + exports: [ChartComponent], + declarations: [ChartComponent], + providers: [], }) -export class ChartModule { - static forRoot(): ModuleWithProviders { - return { - ngModule: ChartModule, - providers: [{ - provide: APP_INITIALIZER, - multi: true, - useFactory: (injector: Injector) => () => { - import('chart.js/auto').then((module) => { - console.dir(module) - }) - return Promise.resolve() - }, - deps: [Injector] - }] - } - } -} +export class ChartModule {}