【发布时间】：2021-08-02 09:55:59
【问题描述】：
在升级我的 nodejs（之前是 8，现在是 12）和 angular（之前是 7，现在是 10）之前，我使用的是 ang-jsoneditor。升级后，ang-jsoneditor好像不行，报错
core.js:4442 ERROR TypeError: Cannot read property 'nativeElement' of undefined
at JsonEditorComponent.ngOnInit (ang-jsoneditor.js:50)
at callHook (core.js:3281)
at callHooks (core.js:3251)
at executeInitAndCheckHooks (core.js:3203)
at selectIndexInternal (core.js:6324)
at Module.ɵɵadvance (core.js:6306)
at NewConfigurationEditorComponent_Template (new-configuration-editor.component.html:72)
at executeTemplate (core.js:7511)
at refreshView (core.js:7380)
at refreshComponent (core.js:8527)
我访问了主页https://github.com/mariohmol/ang-jsoneditor，它说只支持从4到9的角度。这是我的package.json，请指教。
{
"name": "configuration-service",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build --prod --aot --output-hashing all",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "10.2.5",
"@angular/cdk": "10.2.7",
"@angular/common": "10.2.5",
"@angular/compiler": "10.2.5",
"@angular/core": "10.2.5",
"@angular/flex-layout": "9.0.0-beta.29",
"@angular/forms": "10.2.5",
"@angular/localize": "^10.2.5",
"@angular/material": "10.2.7",
"@angular/platform-browser": "10.2.5",
"@angular/platform-browser-dynamic": "10.2.5",
"@angular/router": "10.2.5",
"@ng-bootstrap/ng-bootstrap": "6.2.0",
"@ng-select/ng-select": "2.18.0",
"@ngrx/effects": "10.1.2",
"@ngrx/router-store": "10.1.2",
"@ngrx/store": "10.1.2",
"@ngrx/store-devtools": "10.1.2",
"@types/hammerjs": "2.0.36",
"ang-jsoneditor": "1.10.5",
"angular2-uuid": "1.1.1",
"bootstrap": "4.1.3",
"core-js": "2.5.7",
"font-awesome": "4.7.0",
"jsoneditor": "5.32.5",
"material-design-icons": "^3.0.1",
"ng-prettyjson": "0.2.0",
"ng2-search-filter": "^0.5.1",
"ngx-autosize": "1.6.3",
"ngx-clipboard": "^12.3.0",
"ngx-file-drop": "^8.0.8",
"ngx-json-viewer": "2.4.0",
"ngx-tour-core": "^4.1.1",
"ngx-tour-md-menu": "^4.1.1",
"ngx-window-token": "3.0.0",
"rxjs": "6.6.7",
"rxjs-compat": "6.5.2",
"serialize-ts": "2.5.1",
"tslib": "^2.0.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.1002.3",
"@angular/cli": "10.2.3",
"@angular/compiler-cli": "10.2.5",
"@angular/language-service": "10.2.5",
"@ngrx/schematics": "10.1.2",
"@types/jasmine": "2.8.9",
"@types/jasminewd2": "2.0.5",
"@types/node": "^12.11.1",
"codelyzer": "^5.1.2",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"rxjs-tslint-rules": "4.27.1",
"ts-node": "7.0.1",
"tslint": "~6.1.0",
"typescript": "4.0.8"
}
}
【问题讨论】：
-
我不熟悉那个包，但如果你看github.com/mariohmol/ang-jsoneditor/blob/master/…，你会发现他引用了 Angular 10。因此它可能是兼容的。试试吧。
-
你能说明你是如何在你的组件中引用编辑器的吗？
-
@MichaelMairegger，谢谢！将 jsoneditor 更新为“^9.1.8”，将 ang-jsoneditor 更新为“1.10.5”确实有效
标签： angular jsoneditor