如何实际使用Markdown和Meteor

use*_*005 14 html javascript markdown meteor showdown

我正在与Meteor合作开发一个项目,我希望它能使用markdown,很高兴看到有一个软件包可以实现.

所以我的流星添加摊牌,它有效,现在我可以做类似的事情

{{#markdown}}
    #This is a header

    this is a paragraph
{{/markdown}}
Run Code Online (Sandbox Code Playgroud)

它工作得很好.但现在我想在那里放一些更有趣的东西.首先想到的是将它与textarea同步.我尝试了三件事.首先,我试过这个:

$('.preview').html('{{#markdown}}'+$('#text').val()+'{{/markdown}}');
Run Code Online (Sandbox Code Playgroud)

其中.preview是我希望html显示的div,而#text是某人正在键入的textarea.这不起作用,它只显示{{#markdown}}和东西.

接下来,我试着像这样设置div:

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

    {{/markdown}}
</div>
Run Code Online (Sandbox Code Playgroud)

并添加到:

$('.preview').html('#Is this an H1?');
Run Code Online (Sandbox Code Playgroud)

要么

$('.preview').append('*is this italics?*');
Run Code Online (Sandbox Code Playgroud)

但同样,它只显示了文本,而不是html.

最后,我尝试将内容编写到markdown部分,但这显然不起作用.像

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

        </div>
    {{/markdown}}
</div>
Run Code Online (Sandbox Code Playgroud)

要么

<div class="span6 preview">
    {{#markdown}}
        {{>innerPreview}}
    {{/markdown}}
</div>
Run Code Online (Sandbox Code Playgroud)

所以基本上,我已经尝试了我能想到的一切,但没有一个能做到我想要的.我尝试了更多的东西,但我认为你明白了.我怎么用这个?

这很简单:只需将标记放在{{#markdown}} ... {{/ markdown}}标记内.

Aks*_*hat 15

降价内的所有内容都被视为降价,因此请确保执行此操作:

{{#markdown}}{{>innerPreview}}{{/markdown}}
Run Code Online (Sandbox Code Playgroud)

代替

{{#markdown}}
    {{>innerPreview}}
{{/markdown}}
Run Code Online (Sandbox Code Playgroud)

jquery不起作用,因为{{markdown}}在DOM到位之前呈现.

而是使用会话

Template.hello.markdown_data = function() {return Session.get("markdown_data")});
Run Code Online (Sandbox Code Playgroud)

然后你的模板

{{#markdown}}{{{markdown_data}}}{{/markdown}}
Run Code Online (Sandbox Code Playgroud)

然后将您的降价文档存储在

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