Jade : 단락 내부의 링크
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]]
마크 다운 필터를 사용하고 마크 다운 (및 허용 된 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
para가 끝날 때 여분의 공간을 잊지 마십시오 (물론 보이지 않지만 사이에 | 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}
I had to add a period directly behind a link, like this:
This is your test [link].
I solved it like this:
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>.
As suggested by Daniel Baulig, used below with dynamic params
| <a href=!{aData.link}>link</a>
Turns out there is (now at least) a perfectly simple option
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
|
Most simplest thing ever ;) but I was struggling with this myself for a few seconds. Anywho, you need to use an HTML entity for the "@" sign -> @
If you want to in include a link, let's say your/some email address use this:
p
a(href="mailto:me@myemail.com" target="_top") me@myemail.com
참고URL : https://stackoverflow.com/questions/6989653/jade-links-inside-a-paragraph
'IT박스' 카테고리의 다른 글
파이썬 구문에 새로운 문장을 추가 할 수 있습니까? (0) | 2020.07.21 |
---|---|
GetLastError ()에서 반환 한 오류 코드에서 오류 메시지를 얻는 방법은 무엇입니까? (0) | 2020.07.21 |
JQuery는 특정 클래스 접두사가있는 첫 번째 상위 요소를 찾습니다. (0) | 2020.07.21 |
cmake로 공유 라이브러리를 만드는 방법은 무엇입니까? (0) | 2020.07.21 |
C #에서 가비지 콜렉션 강제 실행을위한 우수 사례 (0) | 2020.07.21 |