@aiao/code-editor-angular

@aiao/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);
  }
}