code-editor-angular

基于 CodeMirror 6 的 standalone Angular 代码编辑器，支持 Angular Forms、动态语言、主题与编辑状态配置。

安装

pnpm add @aiao/code-editor @aiao/code-editor-angular

使用

import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { CodeEditor } from '@aiao/code-editor-angular';

@Component({
  selector: 'app-root',
  imports: [FormsModule, CodeEditor],
  template: `
    <ao-code-editor [(ngModel)]="code" (aoChange)="onCodeChange($event)" language="typescript" theme="dark" />
  `
})
export class AppComponent {
  code = '';

  onCodeChange(value: string): void {
    console.log(value);
  }
}

Classes

Class	Description
CodeEditor	CodeEditor Angular 组件

Type Aliases

Type Alias	Description
CodeEditorSetup	CodeMirror 预设配置。
CodeEditorTheme	CodeEditor 主题类型

Variables

Variable	Description
External	Annotation to mark external changes that should not trigger onChange