Я использую ck editor
Я использую модель ng для привязки данных к редактору. В TS файл я написал HTML, который включает button.but кнопка не рендеринга.
Теперь сценарий, я хочу динамически добавить кнопку в ckeditor. Я не могу заставить экземпляр использовать insertHTML (). Пожалуйста, помогите!
HTML:
<ckeditor [(ngModel)]="model.editorData" (change)="onChange($event)" [config]="{ toolbar: [ ] }" [ngModelOptions]="{standalone: true}" [editor]="Editor" ></ckeditor>
<button type="button" (click)="addButton($event,'Boy')" class="btn btn-secondary btn-hover-brand">Student name</button>
TS:
import { Component, OnInit } from '@angular/core';
import * as ClassicEditor from '@ckeditor/ckeditor5-build-classic';
import { CKEditor4 } from 'ckeditor4-angular/ckeditor';
@Component({
selector: 'kt-sms-configuration',
templateUrl: './sms-configuration.component.html',
styleUrls: ['./sms-configuration.component.scss']
})
export class SmsConfigurationComponent implements OnInit {
public Editor = ClassicEditor;
public model = {
editorData: '<p> hello world <button class="btn btn-secondary">Hello</button></p>'
};
constructor() {
}
ngOnInit() {
}
save(){
console.log("in save");
console.log(this.model.editorData);
}
public onChange( event: CKEditor4.EventInfo) {
// console.log(this.model.editorData)
console.log(event);
}
addButton(event: CKEditor4.EventInfo,name){
// SmsConfigurationComponent.Editor.getData();
// SmsConfigurationComponent.Editor.insertHtml();
// editor.insertHtml('Hey man'+name);
this.Editor;
console.log(event);
}
}