【问题标题】:Does Angular 4 supports highcharts-angular (Highcharts wrapper for Angular)?Angular 4 是否支持 highcharts-angular(Angular 的 Highcharts 包装器)?
【发布时间】:2021-04-26 10:05:40
【问题描述】:

我尝试安装从 2.0.02.10.0 的所有 highcharts-angular 版本。 在运行应用程序时,我遇到了类似的错误。

发现模块 C:/dev/Angular-WorkSpace/ma-property-report/node_modules/highcharts-angular/highcharts-angular.d.ts 的元数据版本不匹配错误版本 4,预期 3,解析 C:/dev/Angular-WorkSpace/ma-property-report/src/app/shared/shared.module.ts 中的符号 SharedModule,解析 C:/dev/ 中的符号 SharedModule Angular-WorkSpace/ma-property-report/src/app/shared/shared.module.ts

Error Message Screenshot

在上网时,我知道如果依赖项(highcharts-angular)与 Angular 4 不兼容,就会发生这些错误。 更新到 angular 5 现在不是一个选项。 我尝试将 highcharts-angular 版本从 2.10.0 降级到 2.0.0。 但仍然得到相同的元数据版本不匹配。 这就提出了 Angular 4 是否支持 highcharts-angular(Angular 的 Highcharts 包装器)的问题,如果支持,我该如何解决这个错误?

npm -v
6.14.8

@angular/cli: 1.2.7 // global Angular CLI version = 6.2.9
node: 8.17.0
os: win32 x64

检查我的 package.json 文件。

{
  "name": "underwriter-web",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^4.4.3",
    "@angular/common": "4.3.x",
    "@angular/compiler": "4.3.x",
    "@angular/core": "4.3.x",
    "@angular/forms": "4.3.x",
    "@angular/http": "4.3.x",
    "@angular/platform-browser": "4.3.x",
    "@angular/platform-browser-dynamic": "4.3.x",
    "@angular/router": "4.3.x",
    "@auth0/angular-jwt": "^1.0.0-beta.9",
    "@ng-bootstrap/ng-bootstrap": "1.0.0-beta.5",
    "@realpage-da/ng-map": "1.0.x",
    "@types/nouislider": "^9.0.1",
    "ag-grid": "11.0.0",
    "ag-grid-angular": "11.0.0",
    "ag-grid-enterprise": "11.0.0",
    "angular2-jwt": "0.2.3",
    "bootstrap": "4.0.0-alpha.6",
    "cachefactory": "^3.0.0",
    "core-js": "^2.4.1",
    "file-saver": "1.3.3",
    "font-awesome": "^4.7.0",
    "highcharts": "5.0.12",
    "highcharts-angular": "^2.4.0",
    "lodash": "^4.17.4",
    "moment": "2.18.1",
    "ng2-date-picker": "2.8.1",
    "ng2-toastr": "^4.1.2",
    "ngx-cookie-service": "1.0.9",
    "node-sass": "~4.5.3",
    "nouislider": "^10.1.0",
    "roboto-fontface": "^0.9.0",
    "rxjs": "5.5.0",
    "sass-loader": "^6.0.5",
    "web-animations-js": "^2.3.1",
    "zone.js": "^0.8.4"
  },
  "devDependencies": {
    "@angular/cli": "1.2.7",
    "@angular/compiler-cli": "4.3.x",
    "@types/highcharts": "5.0.10",
    "@types/jasmine": "2.5.38",
    "@types/lodash": "4.14.73",
    "@types/node": "~6.0.60",
    "codelyzer": "~2.0.0",
    "jasmine-core": "~2.5.2",
    "jasmine-spec-reporter": "~3.2.0",
    "karma": "~1.4.1",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^0.2.0",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.0",
    "ts-node": "3.0.4",
    "tslint": "~4.5.0",
    "typescript": "2.3.2"
  }
}

【问题讨论】:

标签: javascript angular typescript highcharts angular2-highcharts


【解决方案1】:

如果您查看 highcharts-angular 包装器从 2.0.0 到 2.10.0 的版本,所有这些都要求 Angular 的版本高于 6.0.0。换句话说,它不会像这样工作。

但你总是可以在没有包装器的情况下在 Angular 中创建图表,如下面的演示所示。
演示:https://stackblitz.com/edit/highcharts-angular-basic-line-i9etwb

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-03-01
    相关资源
    最近更新 更多