1

I have an Angular application and I'm using ngx-codemirror to build a codemirror editor in the application. The editor is in gherkin mode and I need to add support of code folding. In ngx-codemirror there's an option called foldgutter and I have made it true in the option. Also set "CodeMirror-foldgutter" in "gutters" option.

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

In my .ts file I have added all the plugins to check .

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';

Also in my styles.scss i have imported following css

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

But the code folding option is not coming up in the editor. What are the mistakes are there. Or does codemirror even support code folding on gherkin mode or its only available for JS, HTML, Python and XML?

Nabarag Paul
  • 319
  • 5
  • 19

0 Answers0