2012-03-10 1 views
8

안녕 내가 멍청한 놈의 질문이 있어요, 나는 다음과 같은 HTML 결과를 만들려면 : 내가 CSS를 통해 이미지의 스타일에 스팬 수준의 텍스트를 갖고 싶어 위의 HTML에서레일 3 link_to 중첩 된 content_tag와 함께 <a href를 중첩 된 범위로 작성 - 방법?

<a href="/controller/action" class="button-big layer">TEXT<span class="arrow-big"></span></a> 

합니다. 에서

<a href="/controller/action" class="button-big layer">TEXT</a> 

<%= link_to(content_tag(:span, "", :class => "arrow-big"), controller_path, :class => "button-big layer") %> 

결과 :에

<%= link_to "TEXT", controller_path, :class => "button-big layer" %> 

결과 : 나는 다음과 같은 구현을하려고하면

는 결과가 필요한 구현의 한 부분을 반영

<a href="/controller/action" class="button-big layer"><span class="arrow-big"></span></a> 

달성 방법을 아는 사람이 있습니까?

답변

10

단순히 '범위'로 텍스트를 연결할 : + 연산자는 달리 content_tag의 HTML을 탈출하기 때문에

<%= link_to(("TEXT" + content_tag(:span, "", :class => "arrow-big")).html_safe, 
      controller_path, 
      :class => "button-big layer") %> 

당신은 연결 주위 .html_safe가 필요합니다.

+0

안녕하세요, 잘 했어요. 정확히 제가 검색 한 내용이었습니다. css에서 아무런 변화없이 예상대로 작동합니다. 솔루션 :-) – user1260945

+0

이 기능은 훌륭했습니다. 필자의 요구에 맞게 text_tag와 content_tag를 뒤집었지만 정확하게 찾고자했습니다. –

28

당신은 여기에 당신이 content_tag없이 사용할 수있는 또 다른 방법 LINK_TO 도우미

<%= link_to controller_path, :class=> "button-big layer" do %> 
    Text 
    <%= content_tag(:span, "", :class => "arrow_big" %> 
<% end %> 
+0

안녕하세요, 귀하의 솔루션에 감사드립니다, litte "갭"다른 하나뿐만 아니라 작동합니다. 스팬 태그로 삽입되는 "이미지"의 CSS 스타일은 중단 점이 삽입되어 조정되어야합니다. 그러나 큰 일이 아니라, 잘 했어! – user1260945

+0

'link_to'와'content_tag'의 블록 옵션에 대해 아무도 이야기하지 않는 것은 놀라운 일입니다. 마치 아무도 둥지를 틀지 않아도되고, 아무도 haml을 사용하지 않아서 중첩하는 내용이 매우 복잡합니다. 위의 대답을 잘 알고있는 좋은 대답은'link_to'뿐 아니라'content_tag' – ahnbizcad

+0

이 yonks를 찾고 있습니다.블록 옵션을 실행할 수있는 link_to 문서를 이해하지 못했습니다. – Jerome

2

에 대한 대체 구문을 사용하여도 둥지 태그의 수 있습니다. 가장 깨끗하지는 않지만 작동합니다!

<%= link_to '<span class="arrow_big"></span>'.html_safe, controller_path, class: "button-big layer" %> 
1

질문 읽기 나는 나의 문제를 해결했다. 귀하의 질문에 답변하는 또 다른 방법을 제안합니다.

필요한 종류의 링크를 만들기 위해 도우미 메서드를 만들 수 있습니다. 그것은 그것에 대해 좋은이

def link_with_text_and_span(href, text, span_options= {}, link_options = {}) 
    span_tag = content_tag(:span, span_options[:content] || '', :class => span_options[:class] || '') 
    link_to(span_tag, href, :class => link_options[:class] || '') 
    end 

같은 것보기 청소기 될 것입니다. 은 그럼 그냥보기에

<%= link_with_text_and_span("/controller/action", "TEXT", {class: 'arrow-big'}, class: button-big) %> 

PS를이 도우미 메서드를 호출 할 수 있습니다 : 다른 사용자가 그것을 할하시기 바랍니다하려는 경우이 코드는 확실히 개선 될 수있다.