Package Exports

@zakhenry/ngx-codemirror

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@zakhenry/ngx-codemirror) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

ngx-codemirror

DEMO: https://typectrl.github.io/ngx-codemirror/

An Angular component wrapper for CodeMirror that extends ngModel

Based on:

https://github.com/JedWatson/react-codemirror - This project is mostly a port of react-codemirror
https://github.com/chymz/ng2-codemirror - Good to reference

Install

codemirror is a peer dependency and must also be installed

npm install @zakhenry/ngx-codemirror codemirror

Use

Import CodemirrorModule and bring in the codemirror files for parsing the langague you wish to use.

// Added to NgModule
import { CodemirrorModule } from '@zakhenry/ngx-codemirror';

// Import your required language in main.ts or at the root of your application
// see https://codemirror.net/mode/index.html
import 'codemirror/mode/javascript/javascript';
import 'codemirror/mode/markdown/markdown';

Import the base css file and your theme

@import "~codemirror/lib/codemirror.css";
@import "~codemirror/theme/material.css";

Use The Component

<ngx-codemirror 
  [(ngModel)]="content" 
  [options]="{
    lineNumbers: true,
    theme: 'material',
    mode: 'markdown'
  }"
></ngx-codemirror>

Inputs

All Inputs of ngModel

options - options passed to the CodeMirror instance see http://codemirror.net/doc/manual.html#config
name - name applied to the created textarea
autoFocus - setting applied to the created textarea
preserveScrollPosition - preserve previous scroll position after updating value

Outputs

All outputs of ngModel

focusChange - called when the editor is focused or loses focus
scroll - called when the editor is scrolled
cursorActivity - called when the text cursor is moved

License

MIT

GitHub @scttcper · Twitter @scttcper