我已经学习了很多教程，但到目前为止，我还没有成功地使PrimeNG的编辑器模块显示出来!（其他模块如Toast或按钮都工作正常，只有编辑器不工作）。
所以我是这么做的：
- 在应用模块. ts中导入模块**
import { EditorModule } from 'primeng/editor';- 已安装的程序包**
npm install quill --save
npm install @types/quill --save- 已更新Angular -cli. json**
"styles": [ "../node_modules/quill/dist/quill.core.css", "../node_modules/quill/dist/quill.snow.css", ]
"scripts": [ "../node_modules/quill/dist/quill.js" ]- 以2种不同方式插入HTML**
<p-editor [(ngModel)]="text" [style]="{'height':'320px'} ngDefaultControl"></p-editor>
<form style="text-align: center; margin: 0 auto; width: auto" [formGroup]="avisoForm" (ngSubmit)="atualizarCargo()">
...
<p-editor formControlName="msgAviso" [style]="{'height':'320px'}" ngDefaultControl></p-editor>
</form>- 在TS文件中引用它们**
this.avisoForm = new FormGroup({
msgAviso: new FormControl,
titAviso: new FormControl
})
text: string;然而，它并不向最终用户显示任何内容，即使其中显示了p-editor标记：
End-User Screen
我认为这可能是一个CSS问题，但我已经检查了CSS文件，但我几乎无法检索到一个标签，因为它没有显示在页面中的任何东西。（我已经搜索了一个从PrimeNG原始网站，它做了一个标签，但它不在CSS中）。
我已经搜索了很多资料，但我还没有找到任何答案来解决这个问题，有人能帮我吗？谢谢!
资料来源：
3条答案
按热度按时间1tuwyuhd1#
刚才我为PrimeNg Editor创建了一个项目
1.使用最新版本6创建新的Angular 项目
1.编辑angular.json。如果你的angular.json和node_module在树的同一层，请仔细更新它。编辑如下我这样编辑：
"样式"：["源代码/样式. scss"，"节点_模块/羽毛笔/分发/羽毛笔.核心. css"，"节点_模块/羽毛笔/分发/羽毛笔.雪. css"]，"脚本"：["节点_模块/套管/分发服务器/套管. js"]
1.将其导入您的模块：第一个月
导入：[HttpModule，FormsModule，浏览器模块，按钮模块，表格模块，编辑器模块]，
1.在任意模板
<p-editor [(ngModel)]="text1" [style]="{'height':'320px'}"></p-editor> <p>Value: {{text1||'empty'}}</p>中添加html1.并在组件文件中为text1赋值：字符串文本2：细绳;
引用Git的Github存储库
erhoui1w2#
需要将quill的资源添加到您的应用程序中。使用CLI的示例设置如下;
npm安装套筒--保存
将Quill添加到angular. json中的脚本
将Quill css添加到angular. json中的样式
我已经检查了这个解决方案多次与新的angular 7和现有的项目，它的工作就像魅力：）
rjee0c153#
如果您按照步骤操作，但未能显示PrimeNG的编辑器，请验证quill.core.css和quill.snow.css是否存在于文件夹 “node_modules/quill/dist/" 中
如果是，尝试将这些文件导入到您的样式.scss文件中，如下所示：
我肯定会成功的，