从@ ctrl / ngx-codemirror库，如何使用typeScript和angular 5获取codeMirror实例

Question

我正在使用https://github.com/TypeCtrl/ngx-codemirror

中的代码镜像包装器

我正在尝试使用Codemirror或编辑器的实例来编辑某些操作，但我无法获取该实例。

相关问题：Get CodeMirror instance

我需要在点击按钮时在当前光标位置添加文本，因此需要CodeMirror API。

Answer 1

我解决了这个问题。请按照以下步骤获取实例：

import * as CodeMirror from 'codemirror';

在您的html文件中标记您的代码镜像实例：

    <ngx-codemirror #codeeditor
                [(ngModel)]="somemodel"
                [options]="someoptions"
                [autoFocus]=true
                (change)="callBackFunc()"
                (cursorActivity)="functionCall()">
</ngx-codemirror>

使用view-child读取实例

@ViewChild('codeeditor') private codeEditor;

然后您可以在相关功能中获取编辑器对象：

const editor = this.codeEditor.codeMirror;
const doc = editor.getDoc();

请确保您没有在ngOnInit（）中使用它，而是在setTimeOut（）中在ngAfterViewInit（）中使用它，因为只有在视图完全加载后，编辑器才可以使用。