Question

用户应该能够在我的Rails应用程序中设计房间（房间是模型）。当用户访问myapp.com/room/1房间时，会显示其内容和特定设计。

房间的设计或CSS基于房间参数（color1，color2，...）和一些随机生成的设计特征（字体类型，图像边框，......）。保存房间时，这些特征存储在房间模型中。

我不知道如何为每个房间生成特定的CSS。当用户访问myapp.com/room/1时，我的应用应该为room1构建特定的CSS（或SCSS）。应该在哪里（什么控制器）构建CSS？

由于

Answer 1

您也可以让RoomsController回复CSS格式，以便将其付诸实践：

# app/controllers/rooms_controller.rb
class RoomsController
  def show
    @room = Room.find(params[:id])

    respond_to do |format|
      format.html
      format.css
    end
  end
end

然后，您需要实现一个要为CSS格式呈现的模板：

/* app/views/rooms/show.css.erb */
.room {
  background-color: <%= @room.color1 %>;
  color: <%= @room.color2 %>;
}

请注意这与常规模板非常相似。您需要确保这会产生有效的CSS。

您需要确保在用户访问页面时包含样式表。我们假设用户在访问/rooms/1时可以浏览他们的房间设计。这将呈现一个HTML模板，我们可以定义如下：

<!-- app/views/rooms/show.html.erb -->
<% content_for :stylesheet_includes do %>
  <%= stylesheet_link_tag(room_path(@room, format: :css)) %>
<% end %>

<div class="room">
  Room Contents Here
</div>

请注意，我在样式表链接标记周围使用了content_for。我们可以使用它来确保样式表链接标记在布局的头部很好地呈现：

<!-- app/views/layouts/application.html.erb -->
<head>
  <%= yield :stylesheet_includes %>
</head>

当然，您需要自己填写详细信息，但这是解决问题的最合理方法。

Answer 2

如果您设计控制器以响应json请求的show动作，您将能够以json格式检索Room对象的属性

http://localhost.com:3000/rooms/1.json

{"id":1,"color1":"black","color2":"green","created_at":"2014-12-15T19:52:21.235Z","updated_at":"2014-12-15T19:52:21.235Z"}

在这种情况下，您可以使用javascript制作get request，以JSON格式检索数据，然后使用该数据来操作dom。

$.get( "rooms/1.json", function( data ) { alert(data); });

如何根据用户输入创建动态CSS

2 个答案: