Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Editor does not show up if directive is inside a dynamically added element, e.g. due to ng-if #17

Closed
DGJones opened this issue Nov 2, 2017 · 2 comments

Comments

@DGJones
Copy link

DGJones commented Nov 2, 2017

Hi,

This issue, #13, is still a problem as far as I can tell. If the directive is fired after the document.ready runs then bootstrap-markdown will not have initialized the newly added textarea element.

This is a snippet of html that exposes the problem:

<div ng-if="editing === false" marked='comment.value' class='markdown acl-comment-text'></div>
<textarea ng-if="editing === true" 
   data-provide='markdown'
   markdown-editor='{"autofocus": true}'
   name='x' 
   ng-model='comment.value' 
   rows="5">
</textarea>

To initialize the element with bootstrap-markdown I added the following:

 link: function(scope, element, attrs, ngModel) {
          var options = scope.$eval(attrs.markdownEditor);

            // Only initialize the $.markdown plugin once.
            if (! element.hasClass('processed')) {
                element.addClass('processed');

                // if the directive was called after document.ready, e.g. because of ng-if then the element 
		// will not have been initialized by bootstrap-markdown
		if (element.markdown === undefined){
		    element.data('markdown', (data = new $.fn.markdown.Constructor(element[0], {})))
	        }	

                // Setup the markdown WYSIWYG.
                element.markdown({

I've forked the repository and will submit a pull request.

@ghiscoding
Copy link
Owner

Definitely welcome PR, thanks

@DGJones DGJones changed the title ng-if If the markdown-editor directive Editor does not show up if directive is inside a dynamically added element, e.g. due to ng-if Nov 2, 2017
ghiscoding added a commit that referenced this issue Nov 3, 2017
@ghiscoding
Copy link
Owner

ghiscoding commented Nov 3, 2017

Thanks for the PR, I merged, released a version and pushed to NPM. Thanks again
You can click on ⭐ if you like the lib ;)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants