ruby-on-rails - 在 input 和 =f.input 之间使用 simple_form 时遇到问题

Question

这是以下苗条 simple_form 表单的屏幕截图。这显示正确。但这给了我类型 nil 错误。

  = simple_form_for :identity, :url => '/auth/identity/register' do |f| 
  h2 Create New Account

  .form-actions
    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          input type="text", label:false, :class => "inline"

    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          input type="text" id="" name="" f:email


    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          input type="text" id="" name="" f:password

    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          input type="text" id="" name="" f:password_confirmation

    .control-group
        .controls
          = f.button :submit, :class => 'btn-primary'

这是以下代码的屏幕截图。这很好用（不给出 nil 类型错误。因为它需要模型字段。）但是外观被打破了。

= simple_form_for :identity, :url => '/auth/identity/register' do |f| 
  h2 Create New Account

  .form-actions
    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          =f.input :name, label:false

    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          = f.input :email, label:false


    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          = f.input :password, label:false

    .control-group
      .controls
        .input-prepend
          span.add-on
            i.icon-user
          = f.input :password_confirmation, label:false

    .control-group
        .controls
          = f.button :submit, :class => 'btn-primary'

Answer 1

您可以使用安装生成器获取 simple_form 以生成 twitter 引导表单

rails generate simple_form:install --bootstrap

您不必这样做，但它会使您的表单更简单！请参阅文档https://github.com/plataformatec/simple_form

然后回答您的实际问题，您可以像这样添加您的用户图标

= f.input :email, :wrapper => :append do
  = f.input_field :email
   %span.add-on>
     %i.icon-user

附加组件之后的 > 停止 haml 放入一个新行，该行将分隔跨度和输入。有关更多详细信息，请参阅此答案使用 simple_form 附加/前置引导图标