我希望创建一个polymer元素,通常只用于显示内容,但是当"edit-attribute"存在时,则应出现tinymce的内联编辑器。
目前我的实现如下:
<polymer-element name="article-widget" attributes="edit">
<template>
<div id="content"><content></content></div>
</template>
<script>
Polymer('article-widget', {
edit: false,
ready: function() {
tinymce.init({
selector: "div#content",
theme: "modern",
plugins: [
["advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker"],
["searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking"],
["save table contextmenu directionality emoticons template paste"]
],
add_unload_trigger: false,
schema: "html5",
inline: true,
toolbar: "undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | print preview media",
statusbar: false,
});
}
})
</script>
</polymer-element>
您可以看到,我现在甚至没有使用编辑属性作为条件。我只是尝试初始化tinyMCE,但它不起作用。我猜测这是因为tinyMCE无法通过选择器访问元素,因为该元素位于shadow-DOM中。我正确吗?
那么我应该怎么做呢?我非常惊讶,竟然找不到任何在Google上尝试做同样事情的人。