CKEditor-如何获取模板属性 [英] CKEditor - how to get the template attributes

问题描述

我正在使用 CKEditor 的模板插件在编辑器中加载模板。

 模板：[
 {
标题： Quickclick 1，
图片： template1.png，
描述： Quickclick 1 template，
 html_et：< span> test1< / span>，
 html ：'< span> test< / span>'
}] 
  

当用户选择一个模板，就可以加载html了。但是，如果有一种方法可以从 CKEditor 实例中获取当前所选模板的属性，那就太好了。

在这种情况下，我需要获取 html_et 属性值。我没有在与此相关的文档中找到任何东西。任何帮助将不胜感激。

解决方案

@Lingasamy Sakthivel，这不是您在CKEditor中定义模板的方式。

如果要使用模板，则需要在模板插件中创建一个类似于默认文件的文件： https://github.com/ckeditor/ckeditor-dev/blob/major/plugins/templates/templates/ default.js

注意：：在定义测试模板文件时，我已将文件命名为 my_template .js 并为模板定义 CKEDITOR.addTemplates（'my_templates'，{... 为简单起见。

现在，准备好文件后，可以将其分配给编辑器，为此，您需要指定文件的路径（完整或相对于应用程序上下文）和定义

在下面的示例中，我正在加载默认的CKEditor文件以及我的自定义文件：

  var编辑器= CKEDITOR.replace（'editor1'，{
l语言：'en'，
 templates_files：[
'/myApp/ckeditor/plugins/templates/templates/default.js'，
'/myApp/ckeditor/my_templates.js'
]，
 templates：'default，my_templates'
}）; 
  

• 这是文件- https://docs.ckeditor.com/ckeditor4/latest/api/CKEDITOR_config.html#cfg-templates_files


• 这是用于定义- https://docs.ckeditor.com/ckeditor4/latest/api/CKEDITOR_config.html#cfg-templates

---

现在最困难的部分了。您已经写过您想知道选择了哪个模板的信息，但老实说，除了更改插件代码外，我不知道可以采用哪种方法。

何时模板定义被加载，其中的模板被一个
加载，并分配一个 onclick 处理程序。这是恕我直言，我们可以在其中添加您的自定义代码以获取 html_et 属性- https://github.com/ckeditor/ckeditor-dev/blob/major/plugins/templates/dialogs/templates .js＃L53-L55 。

为此，您需要获取编辑器的源版本，在模板插件中进行更改，然后构建您的编辑器（推荐方法）：

• > https://docs.ckeditor.com/ckeditor4/latest/guide/dev_source.html


• https://docs.ckeditor.com/ckeditor4/latest/guide/dev_build.html

或者，您也可以不使用模板插件（可以使用在线生成器完成，您可以在其中删除模板插件）。接下来，您需要手动下载该插件，进行更改，然后通过拖放将其添加到编辑器中 ckeditor / plugins 文件夹中的plugin文件夹，并使用额外插件设置。

I'm using CKEditor's template plugin to load the templates in the editor. In the templates I've defined likt this.

templates: [
    {
    title: "Quickclick 1",
    image: "template1.png",
    description: "Quickclick 1 template",
    html_et: "<span>test1</span>",
    html:'  <span>test</span>'
}]

When the user selects a template, the html is loaded which is fine. But also, it would be great if there is a way to get the property of the current selected template from the CKEditor instance.

I need to get the html_et property value in this case. I didn't find anything in the documentation related to this. Any help would be appreciated.

解决方案

@Lingasamy Sakthivel that is not how you define templates in CKEditor.

If you want to use templates, you need to create a file like the default one in templates plugin: https://github.com/ckeditor/ckeditor-dev/blob/major/plugins/templates/templates/default.js

NOTE: when defining my test template file, I have named the file my_template.js and have given the same name to template definition CKEDITOR.addTemplates( 'my_templates', {... for simplicity.

Now, Once you have the file ready, you can assign it to editor. To do that you need to specify path to your file (full or relative to context of your application) and definitions that should be loaded.

In the example below I'm loading the default CKEditor file as well as my custom one:

var editor = CKEDITOR.replace( 'editor1', {
        language: 'en',
        templates_files : [
            '/myApp/ckeditor/plugins/templates/templates/default.js',
            '/myApp/ckeditor/my_templates.js'
        ],
        templates : 'default,my_templates'
});

• This is for files - https://docs.ckeditor.com/ckeditor4/latest/api/CKEDITOR_config.html#cfg-templates_files
• This is for definitions - https://docs.ckeditor.com/ckeditor4/latest/api/CKEDITOR_config.html#cfg-templates

---

Now the hard part. You have written you want to know which template was selected but to be honest I don't know any way in which you could do that except for changing plugin code.

When template definition is loaded, templates inside it are loaded one by one and assigned an onclick handler. This is IMHO the place we you could add your custom code for getting the html_et property - https://github.com/ckeditor/ckeditor-dev/blob/major/plugins/templates/dialogs/templates.js#L53-L55.

To do that you would need to get the source version of the editor, make changes in template plugin and then building your editor (recommended approach):

• https://docs.ckeditor.com/ckeditor4/latest/guide/dev_source.html
• https://docs.ckeditor.com/ckeditor4/latest/guide/dev_build.html

Alternatively you can download CKEditor without the templates plugin (can be done using online builder where you can remove templates plugin from your build). Next you need to manually download that plugin, make your changes and add that plugin to editor by dropping plugin folder inside ckeditor/plugins folder and using the extraPlugins setting.

这篇关于CKEditor-如何获取模板属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！