CKEditor 未显示在 Angular Boilerplate 项目中
Posted
技术标签:
【中文标题】CKEditor 未显示在 Angular Boilerplate 项目中【英文标题】：CKEditor not showing in Angular Boilerplate project 【发布时间】：2018-03-08 21:01:49 【问题描述】：我正在使用 CkEditor Standard 4.7.3。我的代码不显示 CkEditor，而是显示简单的 TextArea。这是我一直在使用的以下代码。
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<script src="../../../node_modules/ckeditor/ckeditor.js"></script>
<script src="../../../node_modules/ckeditor/adapters/jquery.js"></script>
<script type="text/javascript">
CKEDITOR.replace('myEditor');
</script>
</head>
<body>
<div id="divMailBox">
<span>Subject</span>
<textarea class="ckeditor" id="myEditor" name="myEditor" cols="20" rows="10"><b>New Text can this be changed</b></textarea>
</div>
</body>
</html>
请告诉我要添加的内容
【问题讨论】：
你需要使用 Angular 语法在 Angular 应用程序中显示编辑器 不需要我已经找到答案并添加到下面 【参考方案1】：我找到了答案 查看此网址 https://embed.plnkr.co/hnB0R3/
请按照以下步骤操作 1）安装包 npm install ng2-ckeditor --save
2) 在 index.html 中添加脚本
3) 在 app.module.ts 中添加如下
从 'ng2-ckeditor' 导入 CKEditorModule ;
然后在导入部分添加 CKEditorModule 组件
进口：[
....../* 一些组件 */
,CKEditorModule ],
4) 然后在您的 html 页面中添加以下控件
<ckeditor [(ngModel)]="content" debounce="500">
<p>Hello <strong>world</strong></p>
</ckeditor>
5) 运行并检查页面中的 HTML 编辑器。
【讨论】：
以上是关于CKEditor 未显示在 Angular Boilerplate 项目中的主要内容，如果未能解决你的问题，请参考以下文章
未定义上传适配器 ckeditor5-angular 中的图像上传问题
CKEDITOR mathjax公式在jquery中未正确加载
“ng2-CKEditor”节点模块不适用于打字稿[Angular2]
Angular 中的 CKEditor。 TypeError：插入文本后无法读取 null 的属性“类型”