javascript块内的红宝石[苗条模板]

Question

有一种方法可以在javascript块中放入ruby条件吗？即

javascript:
  var config = {
      common_value_1 : 1, 
      common_value_2 : 2 
  };
  - if my_value === true # this must be a ruby condition
    config.custom_true_value_1 = "1" ;
    config.custom_true_value_2 = "#{my_value}" ;
  - else
    config.custom_false_value_1 = "1" ;
    config.custom_false_value_2 = "#{my_value}" ;

或者这个问题有另一种解决方法吗？因为我可以使用它的丑陋方式:

javascript:
    var config = {
      common_value_1 : 1, 
      common_value_2 : 2 
    };
- if my_value === true # this must be a ruby condition
  javascript:
    config.custom_true_value_1 = "1" ;
    config.custom_true_value_2 = "#{my_value}" ;
- else
  javascript:
    config.custom_false_value_1 = "1" ;
    config.custom_false_value_2 = "#{my_value}" ;

但是我不喜欢它,因为如果config在if和else之间有共同的值,那么我会复制我的代码并且会更大并且难以维护.

更新了更好的示例

Answer 1

您可以使用类似于字符串插值的样式.见下面的例子.

javascript:
  var config = { 
    custom: "#{my_value ? 'truthy' : 'falsy'}",
    current_user: #{raw current_user.to_json}
  };

**以下更新**

如果你想要更高级的配置,我建议你创建一个类,例如

class ClientConfig
  attr_accessor :foo, :bar

  # .. code

  def to_json
    { foo: foo, bar: bar }.to_json
  end
end

# in view file
javascript: 
  var config = ClientConfig.new.to_json

另外你也有机会创造一个红宝石部分我在下面创建了一个例子,他可能不是那么漂亮但是我的作品.

# template_path/_config.html.ruby
def configuration
  { foo: "Hello", bar: "World" }
end

def july_special
  { june_key: "It's June" }
end

def month_name
  Date.today.strftime("%B")
end

config = month_name == 'July' ? configuration.merge(july_special) : configuration

content_tag :script, config.to_json.html_safe

# viewfile
= render 'template_path/config'

所以我的观点是,有多种方法可以做到这一点,你应该尝试找到最适合你和你的应用程序的方式.在我的情况下,我会使用我的第一个例子(在更新之前),如果我只需要一个或两个值,我会去上课ClientConfig.

Answer 2

在纯粹的苗条你没有也raw没有html_safe.在这种情况下,简单地使用双花括号记录在这里:

javascript:
  var data = #{{ JSON.dump([{x: 1, y:2}]) }};

Answer 3

你有2个选择:

1.使用ruby部分

对于复杂的代码,此方案更好.

我有一个ruby对象,我想制作一个JSON.所以,在我的苗条文件中,我将创建一个ruby部分:

ruby:

  myObject = @object.to_json.html_safe

注意html_safe:不要逃避双引号是很重要的.

然后你可以使用myObject内部javascript部分:

javascript:

  var data = #{myObject};

2.使用双花括号

对于简单的情况,请使用javascript部分内部的双花括号,如@fphilipe中所述:

javascript:

  var data = #{{@object.to_json}};