Angular2里Ckeditor销毁的解决方式

一、问题

Angular2中，在使用ckeitor4.x编辑器的页面中，切换到其他页面，其他页面会报警告，警告内容如下： [CKEDITOR] Error code: editor-destroy-iframe. ckeditor.js:21 [CKEDITOR] For more information about this error go to docs.ckeditor.com/#!/guide/de… 根据链接文档解释如下：

翻译过来就是，需要我们在ckeditor从dom中卸载前先把ckeditor销毁。 看了angular1中的使用方式是在进入页面时先判断有没有ckeditor的实例，如果有就先销毁再创建新的，和这里是一个意思。只是这过程中我该如何在angular2中去实现这个销毁的过程。 尝试了一些方法都没有成功。没辙，只能在github.com上查看ng2-ckeditor这个项目里的issue里是否有这个问题。果然有。参考了下，改变两处引入方式，一个是index.html里ckeditor的js地址，二是页面中使用ckeditor组件的位置，config信息里添加插件需求。

二、解决步骤

1. 在应用的index.html页面中将引入的js地址修改为：

2.使用位置修改 <ckeditor [(ngModel)]="templateData.content" [config]="{extraPlugins: 'divarea'}"> 增加[config]="{extraPlugins: 'divarea'}"， 这里需要使用插件divarea

三、总结

问题是解决了，但原理是什么还需要再看看。不过到是体会了遇到解决不了的问题，应该回到社区，回到项目根源。