玉：段落内的链接

我正在尝试用Jade编写一些段落，但是当一个段落中有链接时，发现它很困难。

我能想到的最好的，我想知道是否有一种方法可以减少标记：

p
  span.
   this is the start
   of the para.
  a(href="http://example.com") a link
  span.
    and this is the rest of
    the paragraph.

从jade 1.0开始，有一种更简单的方法可以解决此问题，但是不幸的是，我在官方文档中找不到它。

您可以使用以下语法添加内联元素：

#[a.someClass A Link!]

因此，没有在ap中插入多行的示例将是这样的：

p: #[span this is the start of the para] #[a(href="http://example.com") a link] #[span and this is the rest of the paragraph]

您还可以执行嵌套的内联元素：

p: This is a #[a(href="#") link with a nested #[span element]]

您可以使用markdown过滤器并使用markdown（和允许的HTML）编写段落。

:markdown
  this is the start of the para.
  [a link](http://example.com)
  and this is the rest of the paragraph.

另外，似乎您可以简单地输出HTML而没有任何问题：

p
  | this is the start of the para.
  | <a href="http://example.com">a link</a>
  | and this is he rest of the paragraph

我自己并没有意识到这一点，只是使用jade命令行工具对其进行了测试。似乎工作正常。

编辑： 看来实际上可以完全在Jade中完成，如下所示：

p
  | this is the start of the para  
  a(href='http://example.com;) a link
  |  and this is the rest of the paragraph

在对结束别忘了额外的空间（虽然你看不到它。之间| and，否则会看起来像这样para.a linkand不para a link and

另一种方法是：

p
  | this is the start of the para
  a(href="http://example.com") a link
  | this is he rest of the paragraph.

另一种完全不同的方法是创建一个过滤器，该过滤器首先要在替换链接时刺入，然后再用玉渲染。

h1 happy days
:inline
  p this can have [a link](http://going-nowhere.com/) in it

渲染：

<h1>happy days</h1><p>this can have <a href='http://going-nowhere.com/'>a link</a> in it</p>

完整的工作示例：index.js（与nodejs一起运行）

var f, jade;

jade = require('jade');

jade.filters.inline = function(txt) {
  // simple regex to match links, might be better as parser, but seems overkill
  txt = txt.replace(/\[(.+?)\]\((.+?)\)/, "<a href='$2'>$1</a>");
  return jade.compile(txt)();
};

jadestring = ""+ // p.s. I hate javascript's non-handling of multiline strings
  "h1 happy days\n"+
  ":inline\n"+
  "  p this can have [a link](http://going-nowhere.com/) in it"


f = jade.compile(jadestring);

console.log(f());

一个更通用的解决方案是在一个唯一的块中渲染玉的微型子块（可能由标识${jade goes here}），因此...

p some paragraph text where ${a(href="wherever.htm") the link} is embedded

可以以与上述完全相同的方式来实现。

通用解决方案的工作示例：

var f, jade;

jade = require('jade');

jade.filters.inline = function(txt) {
  txt = txt.replace(/\${(.+?)}/, function(a,b){
    return jade.compile(b)();
  });
  return jade.compile(txt)();
};

jadestring = ""+ // p.s. I hate javascript's non-handling of multiline strings
  "h1 happy days\n"+
  ":inline\n"+
  "  p this can have ${a(href='http://going-nowhere.com/') a link} in it"


f = jade.compile(jadestring);

console.log(f());

如果您的链接来自数据源，则可以使用：

  ul
    each val in results
      p
        | blah blah 
        a(href="#{val.url}") #{val.name}
        |  more blah

参见插值

编辑：已实施此功能，并且已关闭问题，请参见上面的答案。

我发布了一个问题将此功能添加到Jade中

https://github.com/visionmedia/jade/issues/936

尽管还没有时间实施它，所以更多+1可能会有所帮助！

这是我能想到的最好的

-var a = function(href,text){ return "<a href='"+href+"'>"+text+"</a>" }

p this is an !{a("http://example.com/","embedded link")} in the paragraph

渲染...

<p>this is an <a href='http://example.com/'>embedded link</a> in the paragraph</p>

可以，但是感觉有点破烂-确实应该有一个语法！

我没有意识到翡翠需要每个标签一行。我以为我们可以节省空间。如果可以理解ul> li> a [class =“ emmet”] {text}，那就更好了

我必须在链接后直接添加一个句点，如下所示：

This is your test [link].

我这样解决了：

label(for="eula").lbl.lbl-checkbox.lbl-eula #{i18n.signup.text.accept_eula}
    | <a href="#about/termsandconditions" class=".lnk.lnk-eula">#{i18n.signup.links.eula}</a>.

如Daniel Baulig所建议，以下用于动态参数

| <a href=!{aData.link}>link</a>

事实证明（至少现在）有一个非常简单的选择

p Convert a .fit file using <a href="http://connect.garmin.com/"> Garmin Connect's</a> export functionality.

p
    | At Times Like These We Suggest Just Going:
    a(ui-sref="app") HOME
    |  

有史以来最简单的事情；）但是我自己为此挣扎了几秒钟。任何人，您都需要在HTML实体中使用“ @”符号-> @ 如果要在其中包含链接，则可以说您/某些电子邮件地址使用以下代码：

p
    a(href="mailto:me@myemail.com" target="_top") me@myemail.com