从javascript渲染部分，传递类变量的问题

Question

我正在尝试设置一个无限滚动的视图。我通过让javascript加载部分来做到这一点，但问题是我需要传入变量@row（见下面的部分）来计算要加载的对象。

通过下面的js插入partial时不会加载@row变量。

我是不是错误地处理了这个问题（有没有更简单的方法来插入 rails 对象），或者有没有办法将 @row 变量从 js 传递到部分。

控制器：

respond_to do |format|
  format.html
  format.js
end

上面的控制器响应加载的js：

$(' #{render "shared/browse_row" ).insertAfter( $('.row') );

查看：

-(1..6).each do
    = render "shared/browse_row"

browse_row 部分：

.row{'data-row'=> "#{@row}"}
-@row += 1
%ul
    -@i = 0
    -project_row( @row ).each do |project|
        -@i += 1
        -@i == 4 ? right = "right" : right = ""
        %li{:class => right}
            = image_tag( project.display_pic.url(:medium) )
            .filler{'data-link' => '/projects/'+project.id.to_s }
                .filler-text
                    .p-name
                        = project.name
                        .p-creator= "by " + project.creator.name
                    .p-price= "$" + number_with_precision(project.price, :precision => 2).to_s
                    .p-days
                        - if days_left( project ) > 0
                            ="Expires in " + pluralize( days_left( project ), " Day")
                        - else
                            ="Expires Today"
                    .p-percent
                        - percent_funded(project).gsub("%","").to_i > 100 ? percent = "100%" : percent = percent_funded(project)
                        .p-percent-bar{:style => "width:#{ percent };"}

Answer 1

当您使用以下语法渲染它时，您应该将 @row 实例变量传递给部分：

render :partial => "shared/browse_row", :locals => { :row => @row }

然后它将在 browse_row 部分文件中作为名为 row 的变量提供

那么你只需将其更改为：

.row{'data-row'=> "#{row}"}

---

在未来，你可能想做更多类似的事情......

在链接中加载更多项目：

<a href="path_to/more_projects" class="get-new-projects" data-remote="true" data-method="GET">Load more projects</a>

在您的控制器文件中：

def show
  row = params[:row]
  @projects = Project.where('id > ?', row)  

  render :json => { :projects => render_to_string( :partial => 'shared/browse_row.html',
                                                   :locals => { :row => row }) }, 
         :status => :ok
end

然后在你的 ajax 成功回调中：

$('.get-new-projects').live('ajax:success', function(data, json, response) {
  // insert the rendered HTML that we passed in as a JSON string
  $('.row').after(json.projects);
});

这样，您就可以让一切井井有条。您的后端呈现代码，您的前端将呈现的代码放置在页面上需要的位置……每个人都很高兴。