TinyMCE 角高度 100% 不起作用

问题描述 投票:0回答:2

将 TinyMCE 添加到我的项目中,但无法获取填充页面的高度。这是我的 html 页面,只是一个简单的全屏 div,里面有编辑器:

<div class="page-layout blank p-24" fusePerfectScrollbar>
    <editor
        apiKey="8zpue1x5ae105wdqusojcbzo6vov9mpymvixyf4375qv9mfk"
        [init]="{
            menubar: false,
            resize: true,
            height: '100%',
            min_height: 350,
            plugins: [
                'advlist autolink lists link image imagetools imagecharmap preview anchor',
                'searchreplace visualblocks code fullscreen',
                'insertdatetime media table paste code'
            ],
            toolbar:
                'undo redo | formatselect | bold italic backcolor | \
                alignleft aligncenter alignright alignjustify | \
                bullist numlist outdent indent | removeformat | image'
            }"
    ></editor>

</div>

但是当它加载时,它开始就像我将高度设置为 0 一样,直到我尝试调整它的大小。

angular tinymce
2个回答
0
投票

使用您的代码,编辑器标签的高度将分配给将在编辑器组件中创建的 iframe。现在,编辑器标签没有采用封闭 div 的高度,因此您看不到您想要的高度。

添加样式=“高度:100%;”到编辑器标签,那么它将具有包围 div 的高度,然后 iframe 将具有包围编辑器标签的高度。


0
投票

我似乎无法在您的代码中找到错误,但我建议您不要像以前那样共享您的 api 密钥。该代码适用于我,因此您可以根据需要复制/粘贴和编辑:

<editor id="myTextarea" class="editor" apiKey="pasteYourApiKeyHere" [init]="{ 
    width: 600,
    height: 8000,
    plugins: [
      'advlist', 'autolink', 'link', 'image', 'lists', 'charmap', 'preview', 'anchor', 'pagebreak',
      'searchreplace', 'wordcount', 'visualblocks', 'visualchars', 'code', 'fullscreen', 'insertdatetime',
      'media', 'table', 'emoticons', 'help'
    ],}" [(ngModel)]="initialContent" (ngModelChange)="onEditorContentChange()">
 </editor>

请注意,您可能不需要 ngModel 或我正在使用的函数。这些服务用于我的特定目的,并且仅包含粘贴当前正在工作的确切代码。根据您的需要删除或修改。

© www.soinside.com 2019 - 2024. All rights reserved.