search

tanepiper / ngx-tinynodes

Monorepo for components released on NPM @tinynodes
https://tanepiper.github.io/ngx-tinynodes/
Other
37 stars 15 forks source link

this.editorJs is not a constructor #23

Closed tank104 closed 3 years ago

tank104 commented 3 years ago

Which Library? ngx-editorjs

Describe the bug I am trying to setup editorJs in Angular 9 project, but when I run it I get the typescript error "this.editorJs is not a constructor"

To Reproduce Steps to reproduce the behavior:

  1. app.module.ts I added: import { NgxEditorJSComponentModule } from "@tinynodes/ngx-editorjs"; import EditorJS from "@editorjs/editorjs"; ... @NgModule({ ... imports: [ ... NgxEditorJSComponentModule.forRoot({ // Optional Configuration, see all keys below editorjs: { autofocus: false, holder: "editor", initialBlock: "paragraph", data: { time: Date.now(), version: EditorJS.version, blocks: [], }, }, }),

2.markdown-editor-component.html: <ngx-editorjs #ngxEditorJS [holder]="holder">

3.markdown-editor-component.ts:

public holder = "ngx-editorjs-demo"; @ViewChild("ngxEditorJS", { read: NgxEditorJSComponent, static: true }) ngxEditorJS: NgxEditorJSComponent;

Expected behavior Expect to see the editor.js component

Screenshots

Desktop (please complete the following information): Chrome (but any version)

tank104 commented 3 years ago

This looks same as this: https://github.com/tanepiper/ngx-tinynodes/issues/18 but no steps for resoslution there.

tanepiper commented 3 years ago

@tank104 have you also installed the @editorjs/editorjs peer dependency? (I see you probably have but I'm not aware of the rest of your setup). Works for me.

tank104 commented 3 years ago

yup have it here:

"dependencies": { "@agm/core": "~1.1.0", "@akveo/ng2-completer": "~9.0.1", "@angular/animations": "~9.1.0", "@angular/cdk": "^9.2.2", "@angular/common": "~9.1.0", "@angular/compiler": "~9.1.0", "@angular/core": "~9.1.0", "@angular/forms": "~9.1.0", "@angular/material": "^9.2.2", "@angular/platform-browser": "~9.1.0", "@angular/platform-browser-dynamic": "~9.1.0", "@angular/router": "~9.1.0", "@azure/msal-angular": "^1.0.0", "@dagonmetric/ng-log": "^2.2.2", "@dagonmetric/ng-log-applicationinsights": "^2.3.0", "@editorjs/code": "~2.4.1", "@editorjs/editorjs": "^2.17.0", "@editorjs/embed": "~2.2.1", "@editorjs/header": "^2.4.0", "@editorjs/image": "^2.3.3", "@editorjs/inline-code": "^1.3.1", "@editorjs/link": "~2.1.3", "@editorjs/list": "~1.4.0", "@editorjs/marker": "^1.2.2", "@editorjs/paragraph": "^2.6.1", "@editorjs/quote": "~2.3.0", "@editorjs/raw": "^2.1.2", "@editorjs/simple-image": "^1.3.3", "@editorjs/warning": "^1.1.1",

tank104 commented 3 years ago

Hi @tanepiper , any ideas?
Does it need to have Angular Material to work?

Do you have a simple angular project with it working? The example (with full package) works for me, but its really complex and hard to unpack.

tanepiper commented 3 years ago

@tank104 Without your code I can't debug the issue, but there is a demo here for non-material https://github.com/tanepiper/ngx-tinynodes/tree/master/libs/ngx-editorjs/ngx-editorjs-demo/src/lib.

Also have you installed @tinynodes/ngx-editorjs-plugins ?

CarlosValencia78 commented 3 years ago

@tanepiper my set up is about the same and I have @tinynodes/ngx-editorjs-plugins installed as well.

What exact code do you need to see in order to help approach this issue? I can send it right away.

tanepiper commented 3 years ago

Cannot reproduce https://github.com/tanepiper/basic-editorjs-example