Quill编辑器在Angular 8应用程序中未按预期显示

Question

我正在尝试将Quill文本编辑器添加到Angular 8项目中，但是在浏览器中无法正确呈现。

控制台中没有出现错误，这就是浏览器中显示的内容：

我按照here所述的步骤进行安装。

此外，在我的angular.json中提到了以下内容：

"styles": [
    "src/styles.css",
    "./node_modules/quill/dist/quill.core.css",
    "./node_modules/quill/dist/quill.snow.css"
    ],
"scripts": ["./node_modules/quill/dist/quill.js"]

这是我的NgModule中的导入：

imports: [
    BrowserModule,
    AppRoutingModule,
    QuillModule.forRoot()
],

这是我的HTML：

<div id="quill">
    <p>Content *</p>
    <quill-editor [styles]="editorStyle" placeholder="Enter Text" [modules]="config" formControlName="yourCtrlname"
required>
    </quill-editor>
</div>

有人可以告诉我为什么编辑器渲染不正确>

Answer 1

我在我的角度项目中使用羽毛笔，我不确定为什么你的角度json中有那些硬编码的路径-还有一个将羽毛笔包裹在角度模块中的包，我认为这就是你所需要的期望由QuillModule定义，但是我认为您只是在引用羽毛源，而不是特定于angular。我认为如果您从angular.json中删除这些导入，然后运行：

npm install --save quill
npm install --save ngx-quill

然后确保您在模块中已从ngx-quill导入quillModule

import { QuillModule } from 'ngx-quill';

我不记得在启动和运行它时遇到任何困难，但是看起来您有羽毛笔库，但没有角度模块-这似乎是您正在使用/期望的语法，因此认为您只需要正确安装依赖项。