Question

这是CKEditor文档说配置编辑器http://docs.ckeditor.com/#!/guide/dev_toolbarconcepts-section-toolbar-groups-configuration

的方式

我在html中使用这样的

<ckeditor
  [(ngModel)]="ckeditorContent"
  [config]="{toolbar : 'Basic', uiColor: '#FFFFFF'}"
  (change)="onChange($event)"
  (ready)="onReady($event)"
  (focus)="onFocus($event)"
  (blur)="onBlur($event)"
  debounce="1000"
  >
</ckeditor>

那么如何在angular2 ???

中将此配置提供给我的CKEditor

Answer 1

根据documentation，您应将 config 对象作为输入传递：

import { Component } from '@angular/core';

@Component({
  selector: 'sample',
  template: `
  <ckeditor
    [config]="config">
  </ckeditor>
  `
})
export class Sample{
  constructor(){
    this.config = {uiColor: '#99000'};
  }
}

Answer 2

通过配置输入传递配置对象

Answer 3

https://www.npmjs.com/package/ng2-ckeditor

通常，我们可以使用下面的config值删除angular中的工具栏并响应js

this.ckeConfig = {
      allowedContent: false,
      forcePasteAsPlainText: true,
      removePlugins: 'horizontalrule,tabletools,specialchar,about,list,others',
      removeButtons: 'Save,NewPage,Preview,Print,Templates,Replace,SelectAll,Form,Checkbox,Radio,TextField,Textarea,Find,Select,Button,ImageButton,HiddenField,JustifyLeft,JustifyCenter,JustifyRight,JustifyBlock,CopyFormatting,CreateDiv,BidiLtr,BidiRtl,Language,Flash,Smiley,PageBreak,Iframe,Font,FontSize,TextColor,BGColor,ShowBlocks,Cut,Copy,Paste,Table,Image,Format,Source,Maximize,Styles,Anchor,SpecialChar,PasteFromWord,PasteText,Scayt,Undo,Redo,Strike,RemoveFormat,Indent,Outdent,Blockquote,Underline'
    };

Angular2 ckeditor编辑配置

3 个答案: