angular - ngx-codemirror - 小黄瓜模式的代码折叠不起作用

Question

我有一个 Angular 应用程序，我正在使用 ngx-codemirror 在应用程序中构建一个 codemirror 编辑器。编辑器处于小黄瓜模式，我需要添加对代码折叠的支持。在 ngx-codemirror 中有一个名为 foldgutter 的选项，我在该选项中实现了这一点。还要在“gutters”选项中设置“CodeMirror-foldgutter”。

<ngx-codemirror #codemirrorr
[options]="{
 lineNumbers: true,
 theme: 'idea',
 mode: 'gherkin',
 gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'],
 foldGutter: true    
}"
[(ngModel)]="dataSet"
(ngModelChange)="setData($event)">
</ngx-codemirror>

在我的 .ts 文件中，我添加了所有要检查的插件。

import 'codemirror/lib/codemirror';
import 'codemirror/mode/gherkin/gherkin';
import 'codemirror/addon/fold/comment-fold';
import 'codemirror/addon/fold/markdown-fold';
import 'codemirror/addon/fold/foldgutter';
import 'codemirror/addon/fold/brace-fold';
import 'codemirror/addon/fold/foldcode';
import 'codemirror/addon/fold/indent-fold';

同样在我的styles.scss中，我导入了以下css

@import '~codemirror/addon/fold/foldgutter.css';

但是代码折叠选项没有出现在编辑器中。有什么错误。还是 codemirror 甚至支持 gherkin 模式下的代码折叠，还是仅适用于 JS、HTML、Python 和 XML？

标签： angularcucumbercodemirrorgherkincode-folding