Javascript Girl
  1. Javascript Girl
  3. Comment utilise-t-on Markdown avec Meteor
Intereting Posts
Highcharts étiquettes cliquables comment goto ancre JSON.stringify ignore les propriétés de l'objet Le sélecteur jQuery ne fonctionne pas dans IE7 / 8 JQuery définit plusieurs options déroulantes sur sélectionné Lire le fichier ligne par ligne en JavaScript côté client Les promesses de multi-niveau JavaScript sont ignorées. () Définir un délai dans une fonction jQuery / Ajax répétitive Javascript convertit des secondes en un objet date Les préférences d'accès au SDK de Firefox à partir du script de contenu Mise en œuvre de méthodes d'instance / variables dans l'héritage prototypique Obtenir la valeur de la variable javascript dans l'étiquette de modèle Django url HTML DOM createElement in for loop Pourquoi les gens utilisent jQuery pour les opérations de base? Enregistrer la page en tant que dialogue HTML Erreur AJAX étrange avec IE 11

Comment utilise-t-on Markdown avec Meteor

Je travaille sur un projet avec Meteor, et je veux qu'il utilise le markdown, et il était très agréable de voir qu'il y a un paquet pour le faire.

J'ai donc ajouté une confrontation, cela a fonctionné, et maintenant je peux faire quelque chose comme 

{{#markdown}} #This is a header this is a paragraph {{/markdown}}

Et cela fonctionne très bien. Mais maintenant, je veux mettre quelque chose de plus intéressant ici. La première pensée était de le synchroniser avec une zone de texte. J'ai essayé trois choses. D'abord, j'ai essayé ceci: 

 $('.preview').html('{{#markdown}}'+$('#text').val()+'{{/markdown}}');

Où .preview est un div que je veux que html apparaisse et #text est la zone de texte où quelqu'un tape. Cela ne fonctionne pas, il montre simplement le {{#markdown}} et les choses.

Ensuite, j'ai essayé de configurer le div comme ceci: 

 <div class="preview"> {{#markdown}} {{/markdown}} </div>

Et ajoutez-le avec: 

 $('.preview').html('#Is this an H1?');

ou 

 $('.preview').append('*is this italics?*');

Mais encore une fois, il a simplement montré le texte, pas le html.

Enfin, j'ai essayé de coder des choses dans la section de réduction, mais cela ne fonctionnait tout simplement pas. Des choses comme 

 <div class="preview"> {{#markdown}} <div class="previewInner"> </div> {{/markdown}} </div>

ou 

 <div class="span6 preview"> {{#markdown}} {{>innerPreview}} {{/markdown}} </div>

Donc, fondamentalement, j'ai essayé tout ce que je peux penser et rien de ce que je veux. J'ai essayé quelques autres choses, mais je pense que vous avez l'idée. Comment suis-je censé utiliser cela?

C'est simple: mettez votre marque à l'intérieur des balises {{#markdown}} … {{/ markdown}}.

Tout à l'intérieur de la marge est considéré comme un marquage, alors assurez-vous de le faire: 

 {{#markdown}}{{>innerPreview}}{{/markdown}}

Au lieu de 

 {{#markdown}} {{>innerPreview}} {{/markdown}}

Le jquery ne fonctionnerait pas car {{markdown}} est rendu avant que le DOM ne soit mis en place.

Utilisez plutôt une session 

 Template.hello.markdown_data = function() {return Session.get("markdown_data")});

Ensuite, votre modèle 

 {{#markdown}}{{{markdown_data}}}{{/markdown}}

Ensuite, enregistrez votre document de réduction dans

Session.set("markdown_data","<your markdown data>");