entityMap|blocks|key|8733l|text|您可以使用以下命令获取页面上所有编辑器的数组|type|unstyled|depth|inlineStyleRanges|entityRanges|data|85n16|tinymce.editors|code-block|syntax|javascript|el4be|这将返回一个数组，其中包含对每个编辑器的引用。然后，您可以迭代数组并在每个编辑器实例上执行这些命令。|ds79p^0|0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|K|9|@]|A|@]|B|$]]|$2|C|4|D|6|E|8|L|9|@]|A|@]|B|$F|G]]|$2|H|4|I|6|7|8|M|9|@]|A|@]|B|$]]|$2|J|4|-4|6|7|8|N|9|@]|A|@]|B|$]]]]

You can get an array of all the editors on the page with 

<pre><code>tinymce.editors
</code></pre>

This returns an array with references to each editor. You can then iterate over the array and perform those commands on each editor instance.

entityMap|blocks|key|7sta4|text|我从@Michel的回答中得到了这个想法，并编写了以下代码：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|d18he|var+result+=+tinymce.editors;
++++++result.forEach(element+=>+{
++++++++tinymce.get(element.id).getBody().setAttribute('contenteditable',+false);
++++++++tinymce.get(element.id).getBody().style.backgroundColor+=+'#ecf0f5';
++++++});|code-block|syntax|javascript|47d2g^0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|I|9|@]|A|@]|B|$]]|$2|C|4|D|6|E|8|J|9|@]|A|@]|B|$F|G]]|$2|H|4|-4|6|7|8|K|9|@]|A|@]|B|$]]]]

I got the idea from @Michel's answer and wrote the following code:

<pre><code>var result = tinymce.editors;
 result.forEach(element =&gt; {
 tinymce.get(element.id).getBody().setAttribute('contenteditable', false);
 tinymce.get(element.id).getBody().style.backgroundColor = '#ecf0f5';
 });
</code></pre>

entityMap|blocks|key|ff51g|text|您可以简单地禁用编辑器：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|6iolt|<editor+[disabled]="someCondition"></editor>|code-block|syntax|javascript|4g2jn^0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|I|9|@]|A|@]|B|$]]|$2|C|4|D|6|E|8|J|9|@]|A|@]|B|$F|G]]|$2|H|4|-4|6|7|8|K|9|@]|A|@]|B|$]]]]

You can simply disable the editor:
<pre class="lang-html prettyprint-override"><code>&lt;editor [disabled]=&quot;someCondition&quot;&gt;&lt;/editor&gt;
</code></pre>

entityMap|blocks|key|7q9kq|text|似乎其他人已经成功地禁用了控制。当我尝试时，它不允许任何键盘或鼠标交互。因此，我使用了这种方法，这对我来说效果很好，它允许ctrl/a、ctrl/c和鼠标选择，但阻止用户编辑文本。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|b23n8|tinyInitROI:+any+=+{
base_url:+'/hvbi/tinymce',
suffix:+'.min',
resize:+true,
plugins:+"autoresize+fullscreen+print+preview",
autoresize_bottom_margin:+10,
menubar:+false,
toolbar:+'selectall+copy+print+fullscreen',
fullscreen_native:+true,

setup:+function+(editor)+{
++editor.on('keydown',+function+(e,+evt)+{
++++if+(e.ctrlKey+&&+(e.key+==+'a'+%7C%7C+e.key+==+'c'+%7C%7C+e.key+==+'Control'))+{
++++++return;
++++}+else+{
++++++e.preventDefault();
++++}
++}),
++editor.on('contextmenu',+function+(e,+evt)+{
++++e.preventDefault();
++});
}|code-block|syntax|javascript|6iqkc|}|601uj^0|0|0|0^^$0|$]|1|@$2|3|4|5|6|7|8|K|9|@]|A|@]|B|$]]|$2|C|4|D|6|E|8|L|9|@]|A|@]|B|$F|G]]|$2|H|4|I|6|7|8|M|9|@]|A|@]|B|$]]|$2|J|4|-4|6|7|8|N|9|@]|A|@]|B|$]]]]

Seems like others have success disabling the control. When I tried, it wouldn't allow any keyboard or mouse interaction. So instead, I used this approach, which worked well for me, which allows ctrl/a, ctrl/c and mouse selection, but prevents the user from editing the text.
<pre><code>tinyInitROI: any = {
base_url: '/hvbi/tinymce',
suffix: '.min',
resize: true,
plugins: &quot;autoresize fullscreen print preview&quot;,
autoresize_bottom_margin: 10,
menubar: false,
toolbar: 'selectall copy print fullscreen',
fullscreen_native: true,

setup: function (editor) {
 editor.on('keydown', function (e, evt) {
 if (e.ctrlKey &amp;&amp; (e.key == 'a' || e.key == 'c' || e.key == 'Control')) {
 return;
 } else {
 e.preventDefault();
 }
 }),
 editor.on('contextmenu', function (e, evt) {
 e.preventDefault();
 });
}
</code></pre>
}

I have two editors in my form. I am using angular 4. I have applied the following code to set the editor as readonly:

<pre><code>tinymce.activeEditor.getBody().setAttribute('contenteditable', false);
tinymce.activeEditor.getBody().style.backgroundColor = '#ecf0f5';
</code></pre>

But from the above code, only one editor content set as readonly. How to perform this on all editors?

Set tinymce editor content as readonly in angular 4

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋 

腾讯云代码助手

CODING DevOps

Cloud Studio

SDK中心

API中心

命令行工具

 我的表单中有两个编辑器。我使用的是angular 4。我应用了以下代码将编辑器设置为只读： tinymce.activeEditor.getBody().setAttribute('contenteditable', false);tinymce.activeEditor.getBody().style.backgr...

问在angular 4中将tinymce编辑器内容设置为只读
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在angular 4中将tinymce编辑器内容设置为只读EN