ecode-editor v0.0.5

EcodeEditor

代码编辑器 内置monaco_editor

GetStart

安装

npm install ecode-editor --save

导入moudle

imports: [ EcodeEditorModule, ],

在你的style文件中导入css

@import "ecode-editor/styles.less";

配置资源

在angular.json中 "assets": [ { "glob": "**/*", "input": "./node_modules/monaco-editor/min/vs", "output": "assets/vs" } ],

使用组件

html

<ecode-editor [dark]="true" [(ngModel)]="code"></ecode-editor>

ts

import { Component } from '@angular/core';
@Component({
  selector: 'app-test1',
  templateUrl: 'test1.component.html',
  styleUrls: ['./test1.component.less']
})
export class Test1Component {
  code:string = 
  `
    package com.test;
    
    public class Test
    {
    
        public static void main(String[] args)
        {
            System.out.println("Hello Wordl");
        }
    }
  `;
}

属性

dark:boolean 是否暗黑模式 默认true nzEditorOption: 详见参考 monaco editor 的定义