javascript 块中的 ruby​​ [slim 模板]

Question

有没有办法将 ruby​​ 条件放入 javascript 块中？即

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}" ;

但我不喜欢它，因为如果配置在 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

在纯 Slim 中，您没有 raw 或 html_safe。在这些情况下，只需使用 here 中记录的双花括号：

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

Answer 3

你有两个选择：

1。使用ruby 部分

这种情况更适合复杂的代码。

我有一个 ruby​​ 对象，我想制作一个 JSON。因此，在我的 slim 文件中，我将创建一个 ruby 部分：

ruby:

  myObject = @object.to_json.html_safe

注意html_safe：不要转义双引号。

然后您可以在javascript 部分中使用myObject：

javascript:

  var data = #{myObject};

2。使用双花​​括号

对于简单的情况，请在javascript 部分中使用双花括号，如@fphilipe 回答中所述：

javascript:

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