1.创建项目并添加vditor
库
$ ng new PROJECT_NAME
$ cd PROJECT_NAME
$ npm install vditor --save
2.在angular.json
添加vditor
样式表
{
...
"styles":[
...,
"node_modules/vditor/src/assets/less/index.less"
]
}
3.在app.component.html
中添加代码
<div id="vditor"></div>
4.在 app.component.ts
中添加代码
import {Component, OnInit} from '@angular/core';
import Vditor from 'vditor';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
})
export class AppComponent implements OnInit{
vditor: Vditor;
ngOnInit(): void {
this.vditor = new Vditor('vditor', {
height: 360,
toolbarConfig: {
pin: true,
},
cache: {
enable: false,
},
after: () => {
this.vditor.setValue('Hello, Vditor + Angular!');
}
});
}
}