এম্বেডড এইচটিএমএল এর সাথে লিংক_ টু ব্যবহার করা


100

আমি টুইটারের বুটস্ট্র্যাপ স্টাফ ব্যবহার করছি এবং আমার নিম্নলিখিত HTML রয়েছে:

<a class="btn" href="<%= user_path(@user) %>"><i class="icon-ok icon-white"></i> Do it@</a>

রেলগুলিতে এটি করার সর্বোত্তম উপায় কী? আমি ব্যবহার করতে চাই <%= link_to 'Do it', user_path(@user) %>কিন্তু <i class="icon-ok icon-white"></i>আমাকে ফেলে দিচ্ছে?

উত্তর:


260

দুটি উপায়. হয়:

<%= link_to user_path(@user) do %>
  <i class="icon-ok icon-white"></i> Do it@
<% end %>

বা:

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

4
এটি <%= link_to ...ব্লক সহ উদাহরণ হতে হবে ?
ভলডি

এটা অবশ্যই হওয়া উচিত। ধন্যবাদ!
ভেরেটিকাস

4
দ্বিতীয় উদাহরণে আইকনটির জন্য স্ট্রিংয়ের পরে '.html_safe' অনুপস্থিত হতে পারে?
এইচও

আমি জানতাম না যে আপনি একটি ব্লক পাস করতে পারেন link_to- আমাকে শেখানোর জন্য ধন্যবাদ!
yas4891

16

আমার সম্প্রতি একই চাহিদা ছিল। এটা চেষ্টা কর:

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


11

নীচের মতো কোনও সহায়ক পদ্ধতি তৈরি করার সম্ভাবনাও আপনার রয়েছে:

def link_fa_to(icon_name, text, link)
  link_to content_tag(:i, text, :class => "fa fa-#{icon_name}"), link
end

আপনার প্রয়োজন অনুসারে ক্লাসগুলি মানিয়ে নিন।


8

আপনি যদি রেললাইনগুলিতে এমন কোনও লিঙ্ক চান যা টুইটার বুটস্ট্র্যাপ থেকে একই আইকন বর্গ ব্যবহার করে তবে আপনাকে যা করতে হবে তা হ'ল এটি।

<%= link_to "Do it@", user_path(@user), :class => "btn icon-ok icon-white" %>

4
@ পিটারনিক্সি এটি করেন না, এটি এটিকে একটি বোতামের মতো দেখায়। আপনি যদি btnক্লাস ছেড়ে চলে যান তবে আপনি যা দেখছেন তা হ'ল আইকন। বোতাম চেহারা এর অর্থ এটি একটি বোতাম নয়।
ওয়েবডভেশন


6

রত্ন টুইটার-বুটস্ট্র্যাপ-রেল: এগুলি একটি সহায়ক গ্লাইফ তৈরি করে

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

সুতরাং আপনি এটির মতো ব্যবহার করতে পারেন: glyph(:twitter) এবং আপনি লিঙ্ক সহায়কটি দেখতে দেখতে পারে:link_to glyph(:twitter), user_path(@user)


আপনি ট্যাগের জন্য একাধিক ক্ল্যাসের অনুমতি দিতে পারবেন ... সব ক্ষেত্রে, ব্যবহারের ক্ষেত্রে কী হবে?
ইভিভান্স

4
একটি গ্লাইফ (ফন্ট আশ্চর্যজনক) এর সাথে একটি লিঙ্ক তৈরি করার জন্য এটি দুর্দান্ত উপায়! আরও ক্লাস যুক্ত করতে কিছু ব্যবহার করুন <%= link_to glyph(:comments), post_path(post), :class => "btn-small btn-warning" %>। এখানে commentsহ'ল ফন্ট আশ্চর্য চরিত্রের নাম, post_path(post)গন্তব্য url এবং এটি class =>দেখায় যে গ্লাইফ কোন ক্লাস ব্যবহার করবে।
ওয়েস্টন

5

সাধারণ এইচটিএমএল এ আমরা করি,

<a href="register.html"><i class="fa fa-user-plus"></i> Register</a>

রুবি অন রিলে:

<%= link_to routeName_path do %>
  <i class="fa fa-user-plus"></i> Link Name
<% end %>

<%= link_to register_path do %>
   <i class="fa fa-user-plus"></i> Register
<% end %>

এটি আমার আউটপুট


3

আপনি এখনও কোনও উত্তর গ্রহণ করেন নি
এবং অন্য উত্তরগুলি আপনি যা চেয়েছিলেন তা 100% নয় বলে আমি এটি একটি শট দেব ।
এটি রেলস ভাবে করার উপায়।

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

সম্পাদনা: ভবিষ্যতের রেফারেন্সের জন্য আমার উত্তর রেখে দিচ্ছি,
তবে
টুইটার বুটস্ট্র্যাপের সাথে কাজ করার সময় @ জাস্টিন-হেরিকের সঠিক উত্তর রয়েছে ।


2

আমি মনে করি আপনি যদি কোনও অ্যাপ্লিকেশনটিতে ঘন ঘন এটি ব্যবহার করেন তবে কোনও সহায়ক পদ্ধতির মাধ্যমে আপনি এটিকে সহজ করতে পারবেন।

এটি সহায়ক / অ্যাপ্লিকেশন_হেল্পার.আরবিতে রাখুন

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

তারপরে এটিকে আপনার ভিউ ফাইল থেকে লিঙ্ক_ টোর মতো কল করুন

<%= show_link "Do it", user_path(@user) %>

2

আপনি যদি বুটস্ট্র্যাপ ৩.২.০ ব্যবহার করেন তবে আপনি এই সহায়কটি আপনার ব্যবহার করতে পারেন app/helpers/application_helper.rb

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

এবং তারপরে আপনার মতামতে:

link_to glyph(:pencil) + ' Edit', edit_post_path(@post), class: 'btn btn-warning'

1
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

0

তিতাস মিলানের পরামর্শের ভিত্তিতে সহায়ক, তবে একটি ব্লক ব্যবহার করুন:

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
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.