如何将 tinyMCE 内容呈现为

Question

I am learning node.js/express/mongoDB and I am creating a blog. I used tinyMCE as the editor but I cannot figure out how to render my input as html. Instead it is displaying the tags around my content. How can I display it as html?

input with tinyMCE

output with no HTML

here is my code for my show page

<div class="row">
            <div class="col-6 offset-3">

                    <%= blog.body %>

            </div>
        </div>
    </div>

here is my blog creation code

<div class="form-group">
                    <!-- use TINYMCE for textarea -->
                    <label for="blogContent">Blog Content</label>
                    <textarea class="form-control" name="blog[body]" id="editor" cols="30" rows="10" type="hidden"></textarea>
                </div>
                <input class="btn btn-primary mb-3" type="submit">
            </form>
        </div>
    </div>




<% include modal.ejs %>
    <script>
    tinymce.init({
        selector: '#editor',
        plugins: [
                 "image",
           ],
    });
    </script>

Answer 1

Try this, it works perfectly for me. Note, I'm not using node and know very little about it, so adjust accordingly.

HTML:

<textarea id="edit" class="mceEditor"></textarea>

Initialization of Tiny MCE:

tinyMCE.init({
            // General options
            mode : "specific_textareas",
            editor_selector : "mceEditor",
            plugins: 'autoresize'
            });

Retrieve HTML From TinyMCE:

let content   = tinyMCE.get('edit').getContent();

Answer 2

Using this <%= ejs tag, you escape the HTML code. So HTML is not rendered, that's why you see displayed HTML tags.

If you want to unescape the HTML code, use the <%- tag.

<%- blog.body %>

More info here https://ejs.co/

Answer 3

I had the same problem, you should use the <%- instead of <%= tag for rendering HTML. Good Luck!