Angular 如何在cusor点向CK编辑器动态添加数据
我已经实现了CKeditor,但是在编辑器的特定点添加数据时遇到了问题。我浏览了CKeditor文档,所有代码都包含CKeditor关键字,因此如何以及在何处应用它。就像这个但角度很小的实现 我试过身份证Angular 如何在cusor点向CK编辑器动态添加数据,angular,ckeditor,ckeditor4.x,Angular,Ckeditor,Ckeditor4.x,我已经实现了CKeditor,但是在编辑器的特定点添加数据时遇到了问题。我浏览了CKeditor文档,所有代码都包含CKeditor关键字,因此如何以及在何处应用它。就像这个但角度很小的实现 我试过身份证 HTML <div class="row mb-3"> <form role="form" #myForm="ngForm" accept-charset="UTF-8" novalidate>
HTML
<div class="row mb-3">
<form role="form"
#myForm="ngForm" accept-charset="UTF-8" novalidate>
<div
class="form-group has-feedback"
[ngClass]="{ 'has-error': myckeditor.invalid && myckeditor.touched }">
<ckeditor [(ngModel)]="mycontent"
#myckeditor="ngModel"
id = "myckeditor"
name="myckeditor"
required
[config]="ckeConfig"
debounce="500">
</ckeditor>
<div
*ngIf="myckeditor.invalid && myckeditor.touched" class="help-
block">Required field.</div>
</div>
</form>
</div>
<div class="row mb-3">
<button class="btn btn-secondary mr-2 ml-2" (click)="addValue()">CustomerNo</button>
</div>
ts
export class AppComponent {
name = 'ng2-ckeditor';
ckeConfig: any;
mycontent: string;
log: string = '';
@ViewChild("myckeditor") ckeditor: any;
constructor() {
this.mycontent = `<p>My html content</p>`;
}
ngOnInit() {
this.ckeConfig = {
allowedContent: false,
extraPlugins: 'divarea',
forcePasteAsPlainText: true
};
}
public addValue(): void {
this.CKEDITOR.instances['myckeditor'].setData('<p>This is the
editor data.</p>');
}
}
HTML
必填字段。
客户号
ts
导出类AppComponent{
名称='ng2 ckeditor';
配置:任何;
内容:字符串;
日志:字符串=“”;
@ViewChild(“myckeditor”)ckeditor:任何;
构造函数(){
this.mycontent=`我的html内容`;
}
恩戈尼尼特(){
this.ckeConfig={
允许内容:false,
extraPlugins:'divarea',
forcePasteAsPlainText:true
};
}
public addValue():void{
this.CKEDITOR.instances['myckeditor'].setData('这是
编辑数据。”);
}
}
我希望能够通过点击按钮或超链接将值动态附加到CKeditor。\myckeditor=“ngModel”
限制了CKeditor的功能,因此可以使用\myckeditor
并在ts
上使用@ViewChild('CKeditor')公共CKeditor:any
访问编辑器,只需执行this.ckeditor.instance.insertText(temp)
将文本插入光标指针位置
语法和拼写我已经尝试过了,我发现无法读取未定义错误的属性“insertText”