Angular 将typescript库添加到

Angular 将typescript库添加到,angular,typescript,jodit,Angular,Typescript,Jodit,我安装了一个名为的文本编辑器,在尝试将其集成到angular应用程序时遇到了一些问题。 为此,我做了: npm安装--保存jodit 添加到angular.json构建选项sripts“node_modules/jodit/build/jodit.min.js” 在angular.json构建选项样式中添加了“node_modules/jodit/build/jodit.min.css” 以下是我的组件: import * as jodit from 'jodit'; @Component({

我安装了一个名为的文本编辑器,在尝试将其集成到angular应用程序时遇到了一些问题。
为此,我做了:

  • npm安装--保存jodit
  • 添加到angular.json构建选项sripts
    “node_modules/jodit/build/jodit.min.js”
  • 在angular.json构建选项样式中添加了
    “node_modules/jodit/build/jodit.min.css”
  • 以下是我的组件:

    import * as jodit from 'jodit';
    
    @Component({
      selector: 'app-test',
      styleUrls: ['./test.component.scss'],
      template: `
        <textarea id="test" name="editor"></textarea>
      `
    })
    export class TestComponent implements OnInit {
      public editor: any;
    
      constructor() {}
    
      ngOnInit() {//
        const elem: HTMLElement = document.getElementById('test');
        this.editor = new jodit.Jodit(elem, {});
    }
    
    我无法编译它,但通过
    npm start
    我可以使它工作(我仍然有错误,但它可以编译,我可以看到文本编辑器)。

    我是否遗漏了什么,看起来像是类型链接错误?

    我尝试创建角度模块,但现在您可以这样使用它 在您的angular.json中

    "scripts": [
      "../node_modules/jodit/build/jodit.min.js",
    ],
    
    打字中.d.ts添加

    declare var Jodit: any;
    
    然后像这样创建组件

    import {
      Component,
      OnDestroy,
      AfterViewInit,
      EventEmitter,
      Input,
      Output
    } from '@angular/core';
    
    @Component({
      selector: 'simple-jodit',
      template: `<textarea id="{{elementId}}"></textarea>`
    })
    export class SimpleJoditComponent implements AfterViewInit, OnDestroy {
      @Input() elementId: String;
      @Output() onEditorKeyup = new EventEmitter<any>();
    
      editor;
    
      ngAfterViewInit() {
        this.editor = new Jodit('#' + this.elementId, {});
      }
    
      ngOnDestroy() {
       this.editor.destruct();
      }
    }
    
    导入{
    组成部分,
    OnDestroy,
    AfterViewInit,
    事件发射器,
    输入,
    输出
    }从“@angular/core”开始;
    @组成部分({
    选择器:“简单jodit”,
    模板:``
    })
    导出类SimpleJoditComponent实现AfterViewInit、OnDestroy{
    @Input()elementId:String;
    @Output()onEditorKeyup=neweventemitter();
    编辑
    ngAfterViewInit(){
    this.editor=newjodit('#'+this.elementId,{});
    }
    恩贡德斯特罗(){
    this.editor.destruct();
    }
    }
    
    并使用它

    <simple-jodit
      [elementId]="'my-editor-id'"
      (onEditorKeyup)="keyupHandlerFunction($event)"
      >
    </simple-jodit>
    
    
    
    您也可以下载此包装

    src/app/shared/components/jodit.component.ts(19,23):错误TS2304:找不到名称“jodit”我做了你写的所有事情。它不起作用,我不得不修改库源代码以修复一些类型脚本错误。。我把它作为本地依赖项,我使用你的解决方案,泰
    <simple-jodit
      [elementId]="'my-editor-id'"
      (onEditorKeyup)="keyupHandlerFunction($event)"
      >
    </simple-jodit>