Angular 为Ngx编辑器设置自定义高度

我正在使用为我的平均堆栈应用程序创建所见即所得编辑器。一切正常，但我想为这个编辑器设置高度。我尝试在css文件中为组件设置高度，如

.ngx-editor[_ngcontent-c4] .ngx-editor-textarea[_ngcontent-c4] {
    height: 300px !important;
}

但它仍然不起作用

甚至我也尝试像这样从component.html文件设置高度

<div class="form-group">
      <label for="desc">Description</label>
      <app-ngx-editor style="height: 300px" [style]="{'min-height':'320px'}" formControlName="desc" [placeholder]="'Enter text here...'" [spellcheck]="true" [(ngModel)]="htmlContent"></app-ngx-editor>
    </div>

描述

但它仍然不起作用

有人能告诉我如何设置编辑器的高度吗？我已经查阅了它的文档，但到目前为止没有得到任何帮助。有人能告诉我如何设置它的高度吗？任何帮助和建议都非常有用

编辑：请参阅，了解如何通过配置设置最小高度和/或高度

然而。。。我注意到，在minHeight和height之间，没有办法限制高度。因此，我仍然使用我原来的答案，并删除了抓地力

:host app-ngx-editor /deep/ .ngx-editor-grippie {
    display:none;
}

编辑：使用resizer=“basic”将执行与上述相同的操作，但您将在右下角看到一个小夹持器

我最初的答案是如何通过对主机组件样式的深度引用直接设置CSS

您可以通过设置名为

ngx编辑器textarea

的现有样式类的属性

height

来设置的文本区域的高度，如：

:host app-ngx-editor /deep/ .ngx-editor-textarea {
    height:100px !important;
}

---

为他的建议提供道具，同时回答与相关的类似用例。尽管他在元素上设置并使用

id

，但我的解决方案使用现有的类，并且可能在将来的版本中重命名该类。

您只需使用

height

和

minHeight

属性设置编辑器的高度即可

<app-ngx-editor height="100px" minHeight="50px"></app-ngx-editor>

ngx编辑器

“ngx编辑器”支持以下所有html内联属性

editable: boolean;
    /** The spellcheck property specifies whether the element is to have its spelling and grammar checked or not. */
    spellcheck: boolean;        
    /**The translate property specifies whether the content of an element should be translated or not.*/
    translate: string;
    /** Sets height of the editor */
    height: string;
    /** Sets minimum height for the editor */
    minHeight: string;
    /** Sets Width of the editor */
    width: string;
    /** Sets minimum width of the editor */
    minWidth: string;
     /**
     * The editor can be resized vertically.
     *        
    resizer: string;

因此，您可以简单地使用它，如下所示：

<app-ngx-editor height="400"  minheight="200" width="400" minWidth="400"> </app-ngx-editor>

---

有一种方法可以设置工具栏的最小和最大高度 使用配置设置最小和最大高度

在HTML中

.ts文件 创建一个如下所示的变量

textareaConfig={ “可编辑”：true， “拼写检查”：正确， '高度'：'自动'，//您还可以设置高度 “最小高度”：“100px”，

---

};

我认为下面的解决方案应该有效

<app-ngx-editor [height]="'100px'" [minHeight]="'50px'"></app-ngx-editor>

---

请查看属性值中的

“'”

。

这些答案对我都不起作用，因此我必须手动编辑一些CSS（用于引导列）：

：：ng deep{/*渗透CSS样式*/
.NgxEditor{
高度：400px；
溢出y：滚动；
}
.NgxEditor_uu内容{
最小高度：400px；/*使所有编辑器区域都可单击*/
}
}

不确定这是否是最佳解决方案，但它确实有效：）