TinyMCE Javascript所见即所得编辑器不适用于Ember js

Question

I am trying to use TinyMCE with ember js. Code goes as follows -

<script>
        tinymce.init({selector:'textarea'});
</script>

And the textarea is inside the text/x-handlebars template as follows

<script type="text/x-handlebars" data-template-name="course/discussion">
 <textarea>Your content here.</textarea>  
</script>

With the following setup, the TinyMCE is not working.

BUT, if I place the <textarea> outside the text/x-handlebars template, it seems to be working fine.

Any pointers on how do I make TinyMCE work when the <textarea> is inside the handlebars template

Answer 1

Add a view and use the didInsertElement hook to set up tinymce after the template is inserted into the DOM.

App.CourseDiscussionView = Ember.View.extend({
  didInsertElement: function () {
    tinymce.init({selector:'textarea'});
  }
});

http://emberjs.com/api/classes/Ember.View.html#event_didInsertElement