Highcharts Π΄ΠΎΠ»ΠΆΠ΅Π½ ΡΠΌΠ΅ΡΡ Π½Π°Ρ
ΠΎΠ΄ΠΈΡΡ moment
ΠΏΡΠΈ Π·Π°Π³ΡΡΠ·ΠΊΠ΅ ΠΊΠ°ΠΊ ΠΌΠΎΠ΄ΡΠ»Ρ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ import
.
moment
Π½Π΅ ΡΠΎΡ
ΡΠ°Π½ΡΠ΅ΡΡΡ Π½Π° window
, ΠΏΠΎΡΡΠΎΠΌΡ Highcharts ΡΠ΅ΡΠΏΡΡ Π½Π΅ΡΠ΄Π°ΡΡ ΠΏΡΠΈ ΠΏΠΎΠΏΡΡΠΊΠ΅ Π΄ΠΎΡΡΡΠΏΠ° ΠΊ moment
Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ:
https://github.com/highcharts/highcharts/blob/3c8867e8ead548ada66c38f73fce74b2130dac8b/js/parts/Time.js#L370
https://codesandbox.io/s/7yyz98kv4x
Π‘ΠΌ. ΠΠΎΠ΄ ΠΈ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΈ Π² app/app.component.ts
ΠΠΎΠ±Π°Π²ΡΡΠ΅ ΠΏΠ°ΡΠ°ΠΌΠ΅ΡΡΡ API, ΡΠ°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ time.moment
ΠΊΠΎΡΠΎΡΡΠ΅ Π±ΡΠ΄ΡΡ Π½Π°ΡΡΡΠ°ΠΈΠ²Π°ΡΡΡΡ Π΄Π»Ρ ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ, ΡΡΠΎΠ±Ρ ΠΌΠΎΠΆΠ½ΠΎ Π±ΡΠ»ΠΎ Π·Π°Π³ΡΡΠ·ΠΈΡΡ moment
Π² ΠΏΡΠΈΠ²Π΅Π΄Π΅Π½Π½ΡΠΉ Π²ΡΡΠ΅ ΠΊΠΎΠ΄, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ:
moment = options.moment || win.moment;
POC: https://codesandbox.io/s/jjr666l539
Π£ΡΡΠ°Π½ΠΎΠ²ΠΈΡΠ΅ moment
ΠΊΠ°ΠΊ window.moment
, ΡΡΠΎΠ±Ρ Highcharts ΠΌΠΎΠ³Π»ΠΈ Π΅Π³ΠΎ Π½Π°ΠΉΡΠΈ. ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
import * as moment from "moment";
window.moment = moment;
Π£ ΠΌΠ΅Π½Ρ ΡΠ°ΠΊΠ°Ρ ΠΆΠ΅ ΠΏΡΠΎΠ±Π»Π΅ΠΌΠ°, Π½ΠΎ ΠΏΡΠ΅Π΄Π»ΠΎΠΆΠ΅Π½Π½ΠΎΠ΅ Π²Π°ΠΌΠΈ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ Π½Π΅ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ Π΄Π»Ρ ΠΌΠ΅Π½Ρ.
Π― ΠΏΠΎΠ»ΡΡΠ°Ρ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎΠ± ΠΎΡΠΈΠ±ΠΊΠ΅ ΠΏΡΠΈ ΠΊΠΎΠΌΠΏΠΈΠ»ΡΡΠΈΠΈ:
apps/frontend/src/app/solar-data/cell-power-graph/cell-power-graph.component.ts(8,8): error TS2339: Property 'moment' does not exist on type 'Window'.
ΠΠ½ Π±ΡΠ» Π½Π°ΡΡΡΠΎΠ΅Π½ ΡΠ»Π΅Π΄ΡΡΡΠΈΠΌ ΠΎΠ±ΡΠ°Π·ΠΎΠΌ:
import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
import * as Highcharts from 'highcharts';
import ExportingModule from 'highcharts/modules/exporting';
import * as Moment from 'moment';
import * as mTZ from 'moment-timezone';
window.moment = Moment;
mTZ();
@mfechner
ΠΡΠΈΠ±ΠΊΠ° Π½Π΅ ΠΏΠΎΠ²Π»ΠΈΡΠ΅Ρ Π½Π° ΡΠ±ΠΎΡΠΊΡ JavaScript - Π΅ΡΠ»ΠΈ Π²Ρ Π½Π΅ Π½Π°ΡΡΡΠΎΠΈΡΠ΅, ΡΡΠΎΠ±Ρ ΠΏΡΠ΅Π΄ΠΎΡΠ²ΡΠ°ΡΠΈΡΡ ΡΠ±ΠΎΡΠΊΡ Ρ ΠΎΡΠΈΠ±ΠΊΠ°ΠΌΠΈ TS. ΠΠΎΠ΅ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ - Π²ΡΠ΅Π³ΠΎ Π»ΠΈΡΡ ΠΎΠ±Ρ
ΠΎΠ΄Π½ΠΎΠΉ ΠΏΡΡΡ, ΠΏΠΎΡΡΠΎΠΌΡ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΠΈΠ³Π½ΠΎΡΠΈΡΠΎΠ²Π°ΡΡ ΡΡΡ ΠΎΡΠΈΠ±ΠΊΡ TS, ΠΏΡΠ΅ΠΎΠ±ΡΠ°Π·ΠΎΠ²Π°Π² window
Π² any
ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ Π»ΡΠ±ΠΎΠΉ Π΄ΡΡΠ³ΠΎΠΉ ΠΌΠ΅ΡΠΎΠ΄ Π΄Π»Ρ ΠΏΠΎΠ΄Π°Π²Π»Π΅Π½ΠΈΡ ΡΡΠΎΠΉ ΠΎΡΠΈΠ±ΠΊΠΈ.
(window as any).moment = Moment;
ΠΈΠ»ΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΠ°ΡΡΠΈΡΠΈΡΡ ΠΈΠ½ΡΠ΅ΡΡΠ΅ΠΉΡ Window
ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ moment
, ΡΡΠΎ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΏΡΠ°Π²ΠΈΠ»ΡΠ½ΡΠΌ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ Π΄Π»Ρ ΡΡΠΎΠ³ΠΎ ΡΠΈΠΏΠ° ΠΎΡΠΈΠ±ΠΎΠΊ.
ΠΠΎΠ»ΡΡΠΎΠ΅ ΡΠΏΠ°ΡΠΈΠ±ΠΎ Π·Π° ΡΡΠΎΡ ΡΠΎΠ²Π΅Ρ, Ρ ΠΌΠ΅Π½Ρ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΡΠ°Π±ΠΎΡΠ°Π» ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ ΡΠ½ΠΈΠΏΠΈΡ:
import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
import * as Highcharts from 'highcharts';
import ExportingModule from 'highcharts/modules/exporting';
import * as Moment from 'moment';
import * as mTZ from 'moment-timezone';
declare global {
interface Window {
moment: any;
}
}
window.moment = Moment;
mTZ();
ExportingModule(Highcharts);
Highcharts.setOptions({
title: {
...
@Component({
...
})
export class CellPowerGraphComponent implements OnInit, OnDestroy {
...
Π‘Π°ΠΌΡΠΉ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
ΠΠΎΠ»ΡΡΠΎΠ΅ ΡΠΏΠ°ΡΠΈΠ±ΠΎ Π·Π° ΡΡΠΎΡ ΡΠΎΠ²Π΅Ρ, Ρ ΠΌΠ΅Π½Ρ ΠΎΡΠ»ΠΈΡΠ½ΠΎ ΡΡΠ°Π±ΠΎΡΠ°Π» ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ ΡΠ½ΠΈΠΏΠΈΡ: