blocks|key|428558|text|两种方式。以下任一项：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|428559|<%25=+link_to+user_path(@user)+do+%25>
++<i+class="icon-ok+icon-white">+Do+it@
<%25+end+%25>|code-block|syntax|javascript|428560|或者：|428561|<%25=+link_to+'<i+class="icon-ok+icon-white">+Do+it@'.html_safe,+user_path(@user)+%25>|428562|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Two ways. Either:

<pre><code>&lt;%= link_to user_path(@user) do %&gt;
 &lt;i class="icon-ok icon-white"&gt;&lt;/i&gt; Do it@
&lt;% end %&gt;
</code></pre>

Or:

<pre><code>&lt;%= link_to '&lt;i class="icon-ok icon-white"&gt;&lt;/i&gt; Do it@'.html_safe, user_path(@user) %&gt;
</code></pre>

blocks|key|643145|text|最近我也有同样的需求。试试这个：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|643146|<%25=+link_to+'<i+class="icon-ok+icon-white">+Do+it'.html_safe,+user_path(@user)+%25>|offset|length|style|CODE|643147|entityMap^0|0|0|2D|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|K|8|@$D|L|E|M|F|G]]|9|@]|A|$]]|$1|H|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|I|$]]

I had the same need recently. Try this:

<code>&lt;%= link_to '&lt;i class="icon-ok icon-white"&gt;&lt;/i&gt; Do it'.html_safe, user_path(@user) %&gt;</code>

blocks|key|429223|text|您还可以创建一个辅助方法，如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|429224|def+link_fa_to(icon_name,+text,+link)
++link_to+content_tag(:i,+text,+:class+=>+"fa+fa-#{icon_name}"),+link
end|code-block|syntax|javascript|429225|根据您的需要调整这些类。|429226|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

You have also the possibility to create an helper method like below:

<pre><code>def link_fa_to(icon_name, text, link)
 link_to content_tag(:i, text, :class =&gt; "fa fa-#{icon_name}"), link
end
</code></pre>

Adapt the classes to your needs.

blocks|key|643098|text|如果您希望rails中的链接使用来自twitter+bootstrap的相同图标类，则只需如下所示。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|643099|<%25=+link_to+"Do+it@",+user_path(@user),+:class+=>+"btn+icon-ok+icon-white"+%25>|code-block|syntax|javascript|643100|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

If you want a link in rails that uses that same icon class from twitter bootstrap all you need to do is something like this.

<pre><code>&lt;%= link_to "Do it@", user_path(@user), :class =&gt; "btn icon-ok icon-white" %&gt;
</code></pre>

blocks|key|643487|text|使用HAML：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|643488|=+link_to+model_path+do
++%25img{src:+'/assets/someimg.png'}|code-block|syntax|javascript|643489|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Using HAML:

<pre><code>= link_to model_path do
 %img{src: '/assets/someimg.png'}
</code></pre>

blocks|key|428821|text|在gem的twitter-bootstrap-rail中:他们创建了一个助手字形|type|unstyled|depth|inlineStyleRanges|entityRanges|data|428822|++def+glyph(*names)
++++content_tag+:i,+nil,+:class+=>+names.map{%7Cname%7C+"icon-#{name.to_s.gsub('_','-')}"+}
++end|code-block|syntax|javascript|428823|所以你可以像这样使用它：glyph(:twitter)和你的链接帮助器可能看起来像：link_to+glyph(:twitter),++user_path(@user)|offset|length|style|CODE|428824|entityMap^0|0|0|C|F|16|16|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]|$I|T|J|U|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|N|$]]

In the gem twitter-bootstrap-rail : they create a helper glyph 

<pre><code> def glyph(*names)
 content_tag :i, nil, :class =&gt; names.map{|name| "icon-#{name.to_s.gsub('_','-')}" }
 end
</code></pre>

So you can use it like: <code>glyph(:twitter)</code>
and you link helper could look like: <code>link_to glyph(:twitter), user_path(@user)</code>

blocks|key|643821|text|在普通HTML中，我们这样做，|type|unstyled|depth|inlineStyleRanges|entityRanges|data|643822|<a+href="register.html"><i+class="fa+fa-user-plus">+Register</a>|code-block|syntax|javascript|643823|在Ruby+On+Rails中：|643824|<%25=+link_to+routeName_path+do+%25>
++<i+class="fa+fa-user-plus">+Link+Name
<%25+end+%25>

<%25=+link_to+register_path+do+%25>
+++<i+class="fa+fa-user-plus">+Register
<%25+end+%25>|643825|​|643826|📷|atomic|offset|length|643827|643828|entityMap|0|IMAGE|mutability|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/f129e2a9dd8915ee3a59170e7fd4e2bd.jpeg|imageAlt^0|0|0|0|0|0|0|1|0|0|0^^$0|@$1|2|3|4|5|6|7|11|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|12|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|13|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|14|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|15|8|@]|9|@]|A|$]]|$1|M|3|N|5|O|7|16|8|@]|9|@$P|17|Q|18|1|19]]|A|$]]|$1|R|3|L|5|6|7|1A|8|@]|9|@]|A|$]]|$1|S|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]]|T|$U|$5|V|W|X|A|$Y|Z|10|-4]]]]

In normal HTML we do,

<pre><code>&lt;a href="register.html"&gt;&lt;i class="fa fa-user-plus"&gt;&lt;/i&gt; Register&lt;/a&gt;
</code></pre>

In Ruby On Rails:

<pre><code>&lt;%= link_to routeName_path do %&gt;
 &lt;i class="fa fa-user-plus"&gt;&lt;/i&gt; Link Name
&lt;% end %&gt;

&lt;%= link_to register_path do %&gt;
 &lt;i class="fa fa-user-plus"&gt;&lt;/i&gt; Register
&lt;% end %&gt;
</code></pre>

<a href="https://i.stack.imgur.com/xcHZt.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/xcHZt.jpg" alt="This is My Output"></a>

blocks|key|643239|text|我试试看，因为你还没有接受答案|type|unstyled|depth|inlineStyleRanges|entityRanges|data|643240|而其他的答案并不是你想要的100%25。|643241|这就是Rails的方法。|643242|<%25=+link_to(user_path(@user),+:class+=>+'btn')+do+%25>
++<i+class="icon-ok+icon-white">++Do+it!
<%25+end+%25>|code-block|syntax|javascript|643243|编辑:留下我的答案供将来参考，|643244|但是@justin-herrick有正确的答案|643245|使用Twitter+Bootstrap。|643246|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|U|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|V|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|W|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|X|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|Y|8|@]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|R|$]]

I will give this a shot since you haven't accepted an answer yet 
and the other answers are not 100% what you were looking for. 
This is the way to do it the Rails way.

<pre><code>&lt;%= link_to(user_path(@user), :class =&gt; 'btn') do %&gt;
 &lt;i class="icon-ok icon-white"&gt; &lt;/i&gt; Do it!
&lt;% end %&gt;
</code></pre>

Edit: leaving my answer for future reference, 
but @justin-herrick has the correct answer when 
working with Twitter Bootstrap.

blocks|key|428870|text|我认为如果你经常在你的应用程序中使用它，你可以通过一个助手方法来简化它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|428871|将其放在helper/application_helper.rb中|428872|def+show_link(link_text,+link_source)
++link_to("#{content_tag+:i,+nil,+class:+'icon-ok+icon-white'}+#{link_text}".html_safe,
++++link_source,+class:+"btn")
end|code-block|syntax|javascript|428873|然后从视图文件中调用它，就像link_to一样|428874|<%25=+show_link+"Do+it",+user_path(@user)+%25>|428875|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

I think you can simplified it through a helper method if you use it frequently in your application.

put it in helper/application_helper.rb

<pre><code>def show_link(link_text, link_source)
 link_to("#{content_tag :i, nil, class: 'icon-ok icon-white'} #{link_text}".html_safe,
 link_source, class: "btn")
end
</code></pre>

Then call it from your view file just like link_to

<pre><code>&lt;%= show_link "Do it", user_path(@user) %&gt;
</code></pre>

blocks|key|429029|text|如果您使用的是bootstrap+3.2.0，则可以在app/helpers/application_helper.rb中使用此帮助程序|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|429030|module+ApplicationHelper
++def+glyph(*names)
++++content_tag+:i,+nil,+:class+=>+names.map{%7Cname%7C+"glyphicon+glyphicon-#{name.to_s.gsub('_','-')}"+}
++end
end|code-block|syntax|javascript|429031|然后，在您的视图中：|429032|link_to+glyph(:pencil)+%2B+'+Edit',+edit_post_path(@post),+class:+'btn+btn-warning'|429033|entityMap^0|R|X|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|T|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|U|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|V|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|W|8|@]|D|@]|E|$]]]|P|$]]

If you are using the bootstrap 3.2.0, you can use this helper in your <code>app/helpers/application_helper.rb</code>

<pre><code>module ApplicationHelper
 def glyph(*names)
 content_tag :i, nil, :class =&gt; names.map{|name| "glyphicon glyphicon-#{name.to_s.gsub('_','-')}" }
 end
end
</code></pre>

and then, in your views:

<pre><code>link_to glyph(:pencil) + ' Edit', edit_post_path(@post), class: 'btn btn-warning'
</code></pre>

blocks|key|643738|text|def+show_link+(source,+text)
++link_to+source,+{'data-original-title'+=>+'Show',+'data-toggle'+=>+'tooltip',+:class+=>+'btn+btn-xs+btn-success'}+do
++++"#{text}+#{content_tag+:i,+nil,+class:'+glyphicon+glyphicon-eye-open'+}".html_safe
++++end
end|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|643739|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>def show_link (source, text)
 link_to source, {'data-original-title' =&gt; 'Show', 'data-toggle' =&gt; 'tooltip', :class =&gt; 'btn btn-xs btn-success'} do
 "#{text} #{content_tag :i, nil, class:' glyphicon glyphicon-eye-open' }".html_safe
 end
end
</code></pre>

blocks|key|643450|text|Helper基于Titas米兰的建议，但使用了积木：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|643451|def+show_link(link_text,+link_source)
++link_to+link_source,+{+class:+'btn'+}+do
++++"#{content_tag+:i,+nil,+class:+'icon-ok+icon-white'}+#{link_text}".html_safe
++end
end|code-block|syntax|javascript|643452|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Helper based on Titas Milan's suggestion, but using a block:

<pre><code>def show_link(link_text, link_source)
 link_to link_source, { class: 'btn' } do
 "#{content_tag :i, nil, class: 'icon-ok icon-white'} #{link_text}".html_safe
 end
end
</code></pre>

I'm using Twitter's Bootstrap stuff and I have the following HTML:

<pre><code>&lt;a class="btn" href="&lt;%= user_path(@user) %&gt;"&gt;&lt;i class="icon-ok icon-white"&gt;&lt;/i&gt; Do it@&lt;/a&gt;
</code></pre>

What's the best way to do this in Rails? I'd like to use <code>&lt;%= link_to 'Do it', user_path(@user) %&gt;</code> but the <code>&lt;i class="icon-ok icon-white"&gt;&lt;/i&gt;</code> is throwing me off?

Using link_to with embedded HTML

我正在使用Twitter的Bootstrap内容，我有以下HTML：<a class="btn" href="<%= user_path(@user) %>"> Do it@</a>在Rails中做到这一点的最好方法是什么？我想用<%= link_to 'Do it', user_path(@user) %>，但是<i class

问将link_to与嵌入式超文本标记语言结合使用
EN

回答 12

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问将link_to与嵌入式超文本标记语言结合使用EN

回答 12

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问将link_to与嵌入式超文本标记语言结合使用
EN